/* CLK Edits brand kit: white, black, electric green. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=IBM+Plex+Mono:wght@400;500;600&family=Roboto+Slab:wght@900&display=swap');
:root{--bg:#fff;--panel:#f2f3f2;--white:#0a0a0a;--muted:#616661;--line:#d7dbd7;--accent:#75f94c}
body{font-family:Inter,Arial,sans-serif;background:var(--bg)}
header{padding-top:25px;padding-bottom:25px}
.wordmark{align-items:center;gap:9px;letter-spacing:-1.3px;font-weight:800;font-size:27px;white-space:nowrap}
.wordmark span{font:inherit;letter-spacing:inherit;margin:0}.wordmark i{display:none}.brand-mark{width:37px;height:37px;flex-shrink:0}
.wordmark:hover{color:#0a0a0a}.wordmark:hover .brand-mark{background:var(--accent)}
nav a:hover,.text-link:hover,footer>a:last-child:hover{color:#0a0a0a;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px;text-underline-offset:6px}nav span{color:#0a0a0a}
.hero{padding-top:44px;background:#fff}.hero:before{display:none}
.eyebrow,.tiny,.hero-foot,.tags,.art-top,.art-bottom,.frame-no,.service-no,.case-notes article>span,.tool-line,.role{font-family:'IBM Plex Mono',Consolas,monospace}
.eyebrow{color:#616661}.dot{border-radius:0;width:8px;height:8px}
h1{font-family:Inter,Arial,sans-serif;font-size:clamp(70px,9.4vw,145px);font-weight:900;line-height:.99;letter-spacing:-.07em;margin:36px 0}
h1 em{color:#0a0a0a;background:var(--accent);box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 .045em}
.hero-story{font-family:'Roboto Slab',Georgia,serif;font-weight:900;letter-spacing:-.065em}
.period{color:#0a0a0a}h2{font-weight:750;letter-spacing:-.055em}h2 em{color:inherit;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:5px;text-underline-offset:9px}
.button{color:#0a0a0a;border-radius:3px;font-weight:750}.button:hover{background:#61df3a}.skip{color:#0a0a0a}
.hero-bottom{margin-bottom:40px}.hero-foot{color:var(--muted);border-top:0;position:relative;padding-top:25px;margin-top:24px}
.hero-foot:before{content:'';height:11px;position:absolute;left:0;right:0;top:0;background:repeating-linear-gradient(90deg,#b8bdb8 0 1px,transparent 1px 12px);border-top:1px solid var(--line)}
.hero-foot:after{content:'';position:absolute;left:64%;top:-5px;width:2px;height:22px;background:#51c82c;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.case-art{background:#0a0a0a;color:#fff;border-radius:4px;padding:26px 28px}
.art-top,.art-bottom,.story-panel{border-color:#3a3d3a}.art-top,.art-bottom,.frame-no{color:#adb5ad}
.bars i{background:var(--accent);border-radius:0}.uneven i{background:#777f77}.pattern{border-color:var(--accent)}.pattern i{background:var(--accent);border-color:#0a0a0a;outline-color:var(--accent)}
.text-link span{color:#0a0a0a}.case-intro h3,.case-notes h4,.services h3{font-weight:700}.case-notes article>span{color:#616661}
.approach{background:#0a0a0a;color:white;--muted:#b1b7b1;--line:#3a3d3a}.approach .eyebrow,.approach .service-no,.approach .tags{color:var(--accent)}.approach .tiny{color:var(--muted)}.approach h2 em{color:#fff}.services article{border-color:#3a3d3a}
.about{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:8%;align-items:center;background:#f2f3f2}
.portrait{margin:0;position:relative}.portrait:before,.portrait:after{content:'';position:absolute;width:35px;height:35px;z-index:1;pointer-events:none}.portrait:before{top:12px;left:12px;border-top:3px solid var(--accent);border-left:3px solid var(--accent)}.portrait:after{bottom:45px;right:12px;border-bottom:3px solid var(--accent);border-right:3px solid var(--accent)}
.portrait img{display:block;width:100%;height:auto;aspect-ratio:1086/1448;object-fit:cover;background:#20271e}
.portrait figcaption{font-family:'IBM Plex Mono',Consolas,monospace;font-size:9px;letter-spacing:1px;display:flex;justify-content:space-between;padding-top:13px;color:#616661}
.about h2{margin:23px 0 18px;font-size:clamp(42px,4.8vw,70px)}.role{display:block;font-size:11px;line-height:1.7;max-width:380px}.bio{margin-top:30px}.bio p.large{font-size:22px;font-weight:650}.bio p{font-size:13px}.tool-line{color:#616661;font-size:10px}
.closing{background:#fff;position:relative}.closing:before{content:'';display:block;width:46px;height:6px;transform:skewX(-35deg);background:var(--accent);margin:0 auto 28px}.closing h2 em{font-family:'Roboto Slab',Georgia,serif;text-decoration:none;background:var(--accent);padding:0 .07em;box-decoration-break:clone;-webkit-box-decoration-break:clone}.closing h2{font-weight:850;line-height:1.13}.contact-status{border-color:#d7dbd7;background:#f2f3f2}footer{background:#f2f3f2}
a:focus-visible{outline-color:#248400}
@media(max-width:700px){header{gap:12px}.wordmark{gap:5px;font-size:19px;letter-spacing:-.8px}.wordmark span{font-size:inherit}.brand-mark{width:27px;height:27px}nav{gap:14px;font-size:10px}h1{font-size:11.5vw;line-height:1.07;letter-spacing:-.065em}.hero{padding-top:32px}.hero-bottom p{font-size:13px}.hero-foot{font-size:8px}.case-art{padding:18px}.story-panel,.story-panel:first-child{border-color:#3a3d3a}.pattern i{border-color:#0a0a0a}.about{grid-template-columns:1fr;gap:34px}.portrait{max-width:450px;width:100%;margin:0 auto}.about h2{font-size:48px}.bio{margin-top:24px}.closing h2{font-size:clamp(46px,10vw,65px)}h2 em{text-decoration-thickness:3px;text-underline-offset:6px}}
@media(max-width:370px){nav{gap:10px;font-size:9px}.wordmark{font-size:17px}.brand-mark{width:23px;height:23px}.eyebrow{font-size:7px}}
.gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:40px}.gallery-heading p{font-size:13px;color:var(--muted);margin:0}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 28px}.work-card{min-width:0}.work-cover{aspect-ratio:16/9;background:#0a0a0a;color:white;padding:26px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;border-radius:3px}.work-cover:after{content:'';position:absolute;right:-25px;bottom:0;width:25%;height:100%;background:#75f94c;transform:skewX(-24deg);opacity:.15;pointer-events:none}.cover-label,.cover-caption{font:9px 'IBM Plex Mono',Consolas,monospace;letter-spacing:1px;z-index:1}.cover-label{color:#75f94c}.cover-caption{color:#bec5bb}.cover-title{font-size:clamp(28px,3.8vw,50px);font-weight:750;letter-spacing:-2px;z-index:1}.work-card-heading{display:flex;justify-content:space-between;gap:16px;align-items:baseline;margin-top:18px}.work-card h3{font-size:20px;letter-spacing:-.6px;margin:0}.work-card-heading>span{font-size:10px;color:var(--muted)}.work-card>p{font-size:12px;color:var(--muted);margin:8px 0 12px}.work-pending{font:9px 'IBM Plex Mono',Consolas,monospace;color:var(--muted);border-bottom:2px solid var(--accent);padding-bottom:4px}.work-card video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#0a0a0a;border-radius:3px}
@media(max-width:700px){.gallery-heading{display:block;margin-bottom:28px}.gallery-heading p{margin-top:20px}.work-grid{grid-template-columns:1fr;gap:30px}.work-cover{padding:22px}.cover-title{font-size:36px}}
.gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:26px;margin-bottom:30px;border-bottom:1px solid var(--line)}
.work-filters{display:flex;flex-wrap:wrap;gap:8px}.work-filters button{font:500 11px Inter,Arial,sans-serif;cursor:pointer;background:#f2f3f2;border:1px solid transparent;color:#0a0a0a;padding:11px 14px;border-radius:2px}.work-filters button span{font:9px 'IBM Plex Mono',monospace;margin-left:7px;opacity:.7}.work-filters button[aria-pressed="true"]{background:#75f94c}.work-filters button:hover{border-color:#616661}.work-filters button:focus-visible{outline:2px solid #248400;outline-offset:3px}.gallery-hint{font:9px 'IBM Plex Mono',monospace;color:#616661;white-space:nowrap;letter-spacing:.7px}
.work-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:46px 26px}.video-card{border-bottom:1px solid var(--line);padding-bottom:22px}.video-frame{background:#0a0a0a;border-radius:4px;overflow:hidden;aspect-ratio:9/16}.video-card video{display:block;width:100%;height:100%;aspect-ratio:9/16;object-fit:contain;background:#0a0a0a;border-radius:0}.video-meta{display:flex;justify-content:space-between;gap:10px;margin-top:18px;font:9px 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.6px;color:#616661}.video-card .work-card-heading{margin-top:12px}.video-card h3{font-size:22px;line-height:1.2}.video-card p.project-subtitle{color:#0a0a0a;font-size:11px;margin-top:6px;margin-bottom:11px}.video-card>p{font-size:12px;line-height:1.65}.video-error a{text-decoration:underline}.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}[hidden]{display:none!important}
.motion-lab{background:#f2f3f2;padding-top:54px;padding-bottom:58px}.lab-status{font:9px 'IBM Plex Mono',monospace;color:#616661;letter-spacing:1px;display:flex;align-items:center;gap:8px}.lab-status:before{content:'';display:inline-block;height:6px;width:6px;background:#75f94c}.lab-layout{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:10%}.lab-layout h2{font-size:clamp(30px,3.1vw,44px)}.lab-layout p{font-size:14px;color:#616661;max-width:340px}.lab-note{font:10px 'IBM Plex Mono',monospace;color:#616661}.motion-lab .section-top{margin-bottom:28px}
@media(max-width:1050px){.work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-hint{display:none}.gallery-heading{align-items:start}.gallery-heading p{max-width:260px}.gallery-heading p br{display:none}}
@media(max-width:700px){header{flex-wrap:wrap;row-gap:18px}nav{gap:16px;flex-wrap:wrap;font-size:11px}.gallery-heading p{max-width:100%}.gallery-toolbar{padding-bottom:20px;margin-bottom:24px}.work-filters{gap:6px}.work-filters button{font-size:10px;padding:10px 12px}.work-grid{gap:28px 16px}.video-card h3{font-size:19px}.video-meta{font-size:8px;letter-spacing:0}.lab-layout{grid-template-columns:1fr;gap:28px}.motion-lab{padding-top:38px;padding-bottom:40px}}
@media(max-width:520px){.work-grid{grid-template-columns:1fr}.video-frame{max-width:340px;margin:auto}.video-card{max-width:380px;width:100%;margin:auto}.video-card h3{font-size:23px}.video-meta{font-size:9px}.video-card>p{font-size:13px}nav{gap:18px;font-size:10px}.work-filters button{padding:10px 11px}}