/* The page, gutters and navigation share one scroll-driven colour transition. */
:root{--page-bg:#fff;--page-ink:#171717;--page-muted:#777;--page-line:#e1e1e1;--work-tone:0}
html,body{background-color:var(--page-bg)}
html{scrollbar-color:var(--page-muted) var(--page-bg)}
.site-header{background:var(--page-bg);color:var(--page-ink);box-shadow:none}
.site-header .logo img{filter:brightness(0) invert(var(--work-tone))}
.site-header .nav-contact{background:var(--page-ink);color:var(--page-bg)}
.site-header .nav-contact:hover{background:var(--blue);color:#fff}
.site-header #mobile-nav{background:var(--page-bg)}
.menu-toggle>span{background:var(--page-ink)}
.deck-heading{color:var(--page-ink)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.work-section{--work-gutter:clamp(24px,5vw,100px);padding:115px 0 145px;background:#171717;color:#f8f8f8;overflow:hidden;scroll-margin-top:-100px}
.work-enhanced .work-section{background:transparent;color:var(--page-ink)}
.work-container{margin-inline:var(--work-gutter)}
.work-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:45px}
.work-eyebrow{font-size:11px;letter-spacing:.04em;margin-bottom:22px;color:#a6a6a6}
.work-heading h2{font-size:clamp(75px,8.4vw,135px);line-height:.93;letter-spacing:-.065em;font-weight:400}
.work-intro{font-size:15px;line-height:1.65;color:#b5b5b5;padding-bottom:7px}
.work-enhanced .work-eyebrow,.work-enhanced .work-intro{color:var(--page-muted)}
.work-track{--work-gap:26px;--work-card-width:calc((100% + var(--work-gutter) - var(--work-gap) * 2) * 3 / 7);display:flex;gap:var(--work-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--work-gutter);padding:0 var(--work-gutter) 8px;scrollbar-width:none;cursor:grab;touch-action:pan-x pan-y;align-items:flex-start}
.work-track::-webkit-scrollbar{display:none}
.work-track:after{content:'';flex:0 0 max(0px,calc(100% - var(--work-card-width) - var(--work-gap)))}
.work-track:focus-visible{outline:1px solid #397aff;outline-offset:-1px}
.work-track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.work-item{flex:0 0 var(--work-card-width);min-width:0;scroll-snap-align:start}
.work-image{aspect-ratio:1.85;display:flex;align-items:center;justify-content:center;background:var(--project-bg);padding:clamp(16px,1.6vw,28px);position:relative;overflow:hidden;cursor:inherit}
.work-image img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;user-select:none;transition:transform .7s cubic-bezier(.2,.65,.25,1);filter:drop-shadow(0 15px 25px #00000015)}
.work-image[data-work-open="0"] img{clip-path:inset(4% 0 0)}
.work-image.object{padding:clamp(20px,2vw,36px)}
.work-image.identity{padding-block:24px}
.work-image.phone{padding:18px}
.work-image.award{padding:16px}
.work-expand{position:absolute;bottom:18px;right:18px;width:38px;height:38px;display:grid;place-items:center;background:#171717;color:#fff;border:1px solid #ffffff30;font-size:21px;opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
@media(hover:hover){.work-image:hover img{transform:scale(1.025)}.work-image:hover .work-expand{opacity:1;transform:none}}
.work-image:focus-visible .work-expand{opacity:1;transform:none}
.work-track.is-dragging .work-image img{transform:none}
.work-caption{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:22px 0 12px}
.work-caption h3{font-size:23px;font-weight:400;letter-spacing:-.025em;line-height:1.25}
.work-caption p{font-size:11px;color:#aaa;text-align:right}
.work-controls{display:flex;align-items:center;gap:32px;padding-top:30px}
.work-count{font-size:12px;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:#a1a1a1;display:flex;gap:15px;align-items:center;white-space:nowrap}
#work-index{color:#fff}.work-count-divider{color:#626262}
.work-progress{height:1px;background:#414141;flex:1;overflow:hidden}
.work-progress>span{display:block;background:#fff;height:100%;width:100%;transform:scaleX(.083333);transform-origin:left;transition:transform .5s ease}
.work-hint{color:#989898;font-size:10px;white-space:nowrap}
.work-arrows{display:flex;gap:8px}
.work-arrows button,.work-lightbox-controls button{width:44px;height:44px;display:grid;place-items:center;border:1px solid #505050;color:#fff;font-size:18px;transition:background .25s,border-color .25s}
.work-arrows button:hover:not(:disabled),.work-lightbox-controls button:hover:not(:disabled){background:#fff;border-color:#fff;color:#171717}
.work-enhanced .work-caption p,.work-enhanced .work-count,.work-enhanced .work-count-divider,.work-enhanced .work-hint{color:var(--page-muted)}
.work-enhanced #work-index,.work-enhanced .work-arrows button{color:var(--page-ink)}
.work-enhanced .work-progress{background:var(--page-line)}
.work-enhanced .work-progress>span{background:var(--page-ink)}
.work-enhanced .work-arrows button{border-color:var(--page-line)}
.work-enhanced .work-arrows button:hover:not(:disabled){background:var(--page-ink);border-color:var(--page-ink);color:var(--page-bg)}
.work-enhanced .work-heading{opacity:0;transform:translateY(28px);transition:opacity .8s,transform .8s cubic-bezier(.2,.65,.25,1)}
.work-enhanced .work-section.is-visible .work-heading{opacity:1;transform:none}
.work-lightbox{width:calc(100vw - 48px);max-width:1600px;height:calc(100svh - 48px);max-height:none;padding:50px 40px 24px;background:#171717;color:#fff;overflow:hidden}
.work-lightbox::backdrop{background:#070707eb;backdrop-filter:blur(12px)}
.work-lightbox .dialog-close{color:#fff;right:15px;top:10px;z-index:2}
.work-lightbox .dialog-close:hover{background:#333;color:#fff}
.work-lightbox-media{height:calc(100% - 78px);display:flex;align-items:center;justify-content:center;min-height:0}
.work-lightbox-media img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.work-lightbox-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:22px}
.work-lightbox-bottom h2{font-size:20px;letter-spacing:-.025em;margin:0;line-height:1.2}
.work-lightbox-bottom p{font-size:10px;color:#999;margin-top:7px}
.work-lightbox-controls{display:flex;gap:8px;align-items:center;flex-shrink:0}
#work-lightbox-count{font-size:11px;color:#aaa;font-variant-numeric:tabular-nums;margin-right:15px}
@media(max-width:850px){.work-track{--work-card-width:60vw}.work-heading{margin-bottom:40px}.work-intro{font-size:12px}.work-controls{gap:22px}.work-caption h3{font-size:20px}.work-caption p{font-size:10px}}
@media(max-width:650px){
 .work-section{--work-gutter:24px;padding-top:85px;padding-bottom:90px;scroll-margin-top:-85px}
 .work-heading{display:block;margin-bottom:36px}.work-eyebrow{font-size:10px;margin-bottom:20px}.work-heading h2{font-size:76px}.work-intro{margin-top:24px;padding:0;font-size:13px;line-height:1.65}
 .work-track{--work-gap:14px;--work-card-width:84vw}
 .work-image{aspect-ratio:1.18;padding:17px}.work-image.object{padding:25px}.work-image.identity{padding:28px}.work-image.phone,.work-image.award{padding:18px}
 .work-expand{opacity:1;transform:none;width:29px;height:29px;bottom:10px;right:10px;font-size:17px}
 .work-caption{display:block;padding-top:19px}.work-caption h3{font-size:21px}.work-caption p{text-align:left;margin-top:6px;font-size:10px}
 .work-controls{padding-top:20px;gap:18px}.work-count{font-size:10px;gap:8px}.work-hint{display:none}.work-arrows button{width:38px;height:38px}.work-arrows{gap:6px}
 .work-lightbox{width:calc(100vw - 20px);height:calc(100svh - 20px);padding:54px 14px 20px}.work-lightbox-media{height:calc(100% - 112px)}.work-lightbox-bottom{display:block;padding-top:18px}.work-lightbox-bottom h2{font-size:17px}.work-lightbox-controls{justify-content:flex-end;margin-top:12px}.work-lightbox-controls button{width:33px;height:33px}.work-lightbox-bottom p{font-size:9px}#work-lightbox-count{margin-right:auto}
}
@media(prefers-reduced-motion:reduce){.work-enhanced .work-heading{opacity:1;transform:none}.work-track{scroll-behavior:auto}.work-image:hover img{transform:none}}