*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#1a1d1c;background:#d6dcd9;margin:0;font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}::selection{color:#151515;background:#eaff78}nav{z-index:40;color:#fff;pointer-events:none;justify-content:space-between;align-items:center;padding:26px 3vw;display:flex;position:fixed;top:0;left:0;right:0}nav>*{pointer-events:auto}.logo{width:clamp(150px,18vw,216px);display:block}.logo img{width:100%;height:auto;display:block}nav button{color:inherit;background:#111;border:0;border-bottom:1px solid;padding:8px 10px;font-size:13px}.hero{align-items:center;height:100svh;min-height:650px;padding:0 3vw;display:flex;position:relative}.hero h1{letter-spacing:-.075em;z-index:3;margin:0;font-size:clamp(65px,8.8vw,162px);font-weight:500;line-height:.99;position:relative}.hero h1>span{display:block}.inline-image{vertical-align:baseline;z-index:5;background:#151515;border:0;border-radius:3px;width:1.48em;height:.73em;padding:0;display:inline-block;position:relative;overflow:visible}.inline-image>img{object-fit:cover;border-radius:3px;width:100%;height:100%;transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s;position:absolute;inset:0}.inline-image:hover>img,.inline-image:focus-visible>img{transform:scale(3.5)rotate(-8deg);box-shadow:0 20px 80px #0005}.hero-bottom{justify-content:space-between;font-size:12px;line-height:1.5;display:flex;position:absolute;bottom:35px;left:3vw;right:3vw}.hint{letter-spacing:.1em;writing-mode:vertical-rl;font-size:11px;position:absolute;top:29%;right:4vw}.dot{background:#92a044;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.intro{grid-template-columns:1fr 1.3fr;gap:16vw;padding:100px 10vw 180px 3vw;display:grid}.label{letter-spacing:.11em;text-transform:uppercase;font-size:11px;line-height:1.5}.intro p{letter-spacing:-.045em;margin:0;font-size:clamp(29px,3.3vw,57px);line-height:1.08}.intro .label{max-width:220px}.work{color:#e9e9e5;background:#1b1b1b;padding:130px 3vw 150px}.work-intro{text-align:center;max-width:850px;margin:0 auto 145px}.work-intro h2{letter-spacing:-.055em;margin:25px 0;font-size:clamp(38px,4.7vw,79px);font-weight:400;line-height:1.05}.work-intro p{color:#a7aaa5;max-width:450px;margin:auto;font-size:14px;line-height:1.6}.grid{grid-template-columns:1fr 1fr;align-items:start;gap:0 8vw;padding:0 5vw;display:grid}.card{text-align:left;width:100%;color:inherit;background:0 0;border:0;margin:0 0 130px;padding:0;display:block}.card:nth-child(2n){margin-top:180px}.picture{background:#333;height:43vw;min-height:340px;max-height:680px;position:relative;overflow:hidden}.picture>img{object-fit:cover;will-change:transform;width:100%;height:115%;transition:scale .75s}.card .category{background:#161616aa;border-radius:99px;padding:6px 9px;font-size:9px;position:absolute;top:18px;right:18px}.circle{color:#151515;background:#eaff78;border-radius:50%;place-items:center;width:66px;height:66px;font-size:26px;transition:transform .25s;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.card:hover .circle,.card:focus-visible .circle{transform:translate(-50%,-50%)scale(1)}.card .label{margin:24px 0 16px;font-size:10px;display:block}.card h3{letter-spacing:-.045em;max-width:480px;margin:0;font-size:clamp(24px,2.6vw,42px);font-weight:400;line-height:1.15}.tablet{background:#c2cda8;justify-content:center;align-items:center;display:flex}.tablet>img{object-fit:contain;width:83%;height:auto;transform:rotate(-8deg)translateY(-18%)}.tablet.blue{background:#596e94}.tablet.blue>img{transform:rotate(8deg)translateY(-34%)}.outro{color:#e3e5df;background:#111;grid-template-columns:1fr 1.2fr;gap:8vw;padding:100px 8vw 160px;display:grid}.outro h2{letter-spacing:-.06em;margin:0;font-size:clamp(45px,5.6vw,92px);font-weight:400;line-height:1.02}.outro p{color:#9caaa1;max-width:430px;line-height:1.7}.contact{color:#e3e5df;background:#111;padding:50px 3vw 25px}.credits{color:#818a84;border-top:1px solid #343835;justify-content:space-between;gap:25px;padding-top:23px;font-size:10px;line-height:1.5;display:flex}.credits a{text-decoration:underline}.reveal{opacity:0;transition:opacity .8s,transform .9s;transform:translateY(45px)}.reveal.show{opacity:1;transform:none}dialog{color:#161b17;background:#d6dcd9;border:0;border-radius:4px;width:min(880px,92vw);max-height:90svh;padding:65px;overflow-y:auto}dialog::backdrop{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000a}dialog h2{letter-spacing:-.065em;margin:35px 0;font-size:clamp(45px,7vw,90px);font-weight:400;line-height:1}dialog p{max-width:680px;font-size:20px;line-height:1.55}dialog .close{background:0 0;border:0;font-size:25px;position:absolute;top:20px;right:25px}dialog .stack{border-top:1px solid #a6b0aa;margin-top:30px;padding-top:20px;font-size:12px}.menu{color:#182019;z-index:35;background:#eaff78;flex-direction:column;justify-content:center;gap:13px;padding:15vh 8vw;display:none;position:fixed;inset:0}.menu.open{display:flex}.menu a{letter-spacing:-.07em;font-size:clamp(55px,9vw,135px);line-height:1}.cursor{z-index:70;pointer-events:none;mix-blend-mode:difference;background:#eaff78;border-radius:50%;width:8px;height:8px;position:fixed;top:0;left:0}@media (max-width:760px){.hero{min-height:550px}.hero h1{font-size:12vw}.hero-bottom{font-size:10px}.hint{display:none}.intro{grid-template-columns:1fr;gap:35px;padding:50px 6vw 90px}.work{padding-top:85px}.work-intro{margin-bottom:75px}.grid{grid-template-columns:1fr;padding:0 3vw}.card,.card:nth-child(2n){margin:0 0 70px}.picture{height:115vw;min-height:0;max-height:640px}.circle{transform:translate(-50%,-50%)scale(.7)}.outro{grid-template-columns:1fr;gap:35px;padding:65px 6vw 90px}.credits{flex-wrap:wrap}dialog{padding:55px 25px 30px}.cursor{display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:after{transition:none!important}.reveal{opacity:1;transform:none}.cursor{display:none}}.diagonal-track{background:#181a19;height:280svh;position:relative}.diagonal-stage{isolation:isolate;color:#fff;height:100svh;min-height:480px;position:sticky;top:0;overflow:hidden}.collage-plane{transform-origin:50%;will-change:transform;grid-template-columns:repeat(5,minmax(0,1fr));gap:2vw;width:138vw;display:grid;position:absolute;top:50%;left:-19vw;transform:translateY(-50%)}.image-column{will-change:transform}.image-column img{width:100%;height:auto;display:block}.collage-shade{pointer-events:none;background:linear-gradient(90deg,#0006,#0002),linear-gradient(#0000 70%,#0008);position:absolute;inset:0}.diagonal-title{letter-spacing:-.075em;z-index:3;text-shadow:0 2px 28px #0002;margin:0;font-size:clamp(72px,10vw,180px);font-weight:500;line-height:.9;position:absolute;top:50%;left:3vw;transform:translateY(-50%)}.diagonal-title span{will-change:transform;display:block}.diagonal-title span:nth-child(2){margin-left:18vw}.diagonal-title span:nth-child(3){margin-left:3vw}.diagonal-stage .hero-bottom{z-index:4}.diagonal-stage .hero-bottom a{align-self:end}@media (max-width:760px){.diagonal-track{height:230svh}.collage-plane{gap:4vw;width:240vw;left:-70vw}.diagonal-title{font-size:15vw;left:5vw}.diagonal-title span:nth-child(2){margin-left:6vw}.diagonal-title span:nth-child(3){margin-left:0}.diagonal-stage .hero-bottom{gap:15px;left:5vw;right:5vw}}@media (prefers-reduced-motion:reduce){.diagonal-track{height:100svh}.collage-plane{transform:translateY(-50%)rotate(14deg)}.image-column:nth-child(2n){transform:translateY(-8%)}}.card.reveal{opacity:1;transition:none;transform:none}.card .picture{opacity:0;clip-path:inset(6% 0 0);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform 1.1s cubic-bezier(.22,1,.36,1),clip-path 1.1s cubic-bezier(.22,1,.36,1);transform:translateY(32px)}.card.show .picture{opacity:1;clip-path:inset(0);transform:translate(0,0)}.card>.label,.card>h3{opacity:0;transition:opacity .65s,transform .85s cubic-bezier(.22,1,.36,1);transform:translateY(18px)}.card.show>.label{opacity:1;transition-delay:90ms;transform:none}.card.show>h3{opacity:1;transition-delay:.16s;transform:none}.picture:not(.tablet)>img{height:120%;transform:translate3d(0, var(--image-y,0px), 0) scale(var(--hover-scale,1));will-change:transform;transition:transform;position:absolute;top:-10%;left:0;scale:1}.card:hover .picture>img{scale:1}.picture.tablet>img{will-change:transform;transform:translate3d(0, calc(-18% + var(--image-y,0px)), 0) rotate(-8deg) scale(var(--hover-scale,1));transition:transform}.picture.tablet.blue>img{transform:translate3d(0, calc(-34% + var(--image-y,0px)), 0) rotate(8deg) scale(var(--hover-scale,1))}.work-intro.reveal,.intro .reveal{transition:opacity .8s,transform 1s cubic-bezier(.22,1,.36,1);transform:translateY(22px)}.work-intro.show,.intro .show{transform:none}.card:focus-visible{outline-offset:10px;outline:2px solid #eaff78}@media (max-width:760px){.card .picture{transform:translateY(20px)}.card.show .picture{transform:none}}@media (prefers-reduced-motion:reduce){.card .picture,.card>.label,.card>h3{opacity:1;clip-path:none;transition:none;transform:none}.picture:not(.tablet)>img{transform:none}.picture.tablet>img{transform:rotate(-8deg)translateY(-18%)}.picture.tablet.blue>img{transform:rotate(8deg)translateY(-34%)}}@media (min-width:761px){.grid>.card:nth-child(2n){transform:translate3d(0, var(--row-align,0px), 0);will-change:transform;transition:none}}@media (max-width:760px){.grid>.card:nth-child(2n){transform:none}}@media (prefers-reduced-motion:reduce){.grid>.card:nth-child(2n){transform:none}}.diagonal-track{height:190svh}.image-column img{animation:1.45s cubic-bezier(.16,1,.3,1) both column-arrival;animation-delay:var(--arrival-delay,0s)}.image-column:nth-child(odd){--arrival-from:-85vh;--arrival-delay:40ms}.image-column:nth-child(2n){--arrival-from:85vh;--arrival-delay:.12s}.image-column:nth-child(3){--arrival-delay:.18s}.image-column:nth-child(4){--arrival-delay:80ms}.image-column:nth-child(5){--arrival-delay:.14s}@keyframes column-arrival{0%{opacity:0;transform:translate3d(0, var(--arrival-from), 0)}to{opacity:1;transform:translate(0,0)}}@media (max-width:760px){.diagonal-track{height:170svh}}@media (prefers-reduced-motion:reduce){.diagonal-track{height:100svh}.image-column img{animation:none}}.picture:not(.tablet)>img{height:140%;top:-20%}.cursor{opacity:0}.cursor.active{opacity:1}body:has(dialog[open]){overflow:hidden}