.work{overflow:hidden}
.work-heading{display:grid;grid-template-columns:1fr auto auto;align-items:end;gap:40px;margin:0 0 60px;position:relative}
.work-heading h2{font:400 clamp(55px,8vw,120px)/.9 var(--display);letter-spacing:-.075em;margin:0}.work-heading h2 em{font-style:normal;color:#bc3c17;display:inline-block}
.work-heading>p{font-size:14px;line-height:1.6;color:#60594f;margin:0 0 8px}.work-asterisk{font-size:90px;color:var(--acid);display:inline-block;line-height:1}
.gallery-entered .work-asterisk{animation:gallery-star 1.4s cubic-bezier(.2,.8,.2,1) both}.gallery-entered h2 em{animation:cut-arrive .9s cubic-bezier(.16,1,.3,1) both}
.work-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:27px;align-items:start}
.work-card:nth-child(2){margin-top:75px}.work-card:nth-child(3){margin-top:20px}.work-card:nth-child(4){margin-top:95px}
.work-card:before{display:none}.project-launch{position:relative;display:block;isolation:isolate;overflow:hidden;aspect-ratio:9/16;background:#25231f;color:var(--paper);text-decoration:none;outline-offset:5px}
.project-launch>img{display:block;width:100%;height:100%;object-fit:cover;transition:scale .7s cubic-bezier(.2,.7,.2,1),filter .5s}
.project-launch:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.6),transparent 25%,transparent 65%,rgba(0,0,0,.65));z-index:1;pointer-events:none}
.project-launch:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,93,39,0);z-index:2;transition:border-color .4s;pointer-events:none}
.project-topline{position:absolute;top:15px;left:14px;right:14px;display:flex;gap:12px;justify-content:space-between;font:8px/1.6 var(--mono);z-index:2;letter-spacing:.02em}
.project-play{position:absolute;bottom:14px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;font:9px/1.3 var(--mono);z-index:2}
.project-play>b{display:grid;place-items:center;font:26px var(--sans);font-weight:400;background:var(--acid);color:var(--ink);width:43px;height:43px;border-radius:50%;transition:rotate .45s,scale .45s}.project-play>span{transition:translate .4s}
.project-launch:hover>img,.project-launch:focus-visible>img{scale:1.045;filter:saturate(1.08)}.project-launch:hover:after{border-color:var(--acid)}.project-launch:hover .project-play>b,.project-launch:focus-visible .project-play>b{rotate:45deg;scale:1.12}.project-launch:hover .project-play>span{translate:4px 0}
.work-meta h3{font-size:17px;font-weight:500;line-height:1.25}.work-meta .project-summary{font-size:10px;line-height:1.65}.work-card .work-meta{padding-top:18px}
.work-card-landscape{grid-column:1/-1;display:grid;grid-template-columns:.65fr 1.35fr;gap:45px;align-items:center;margin-top:65px!important}
.work-card-landscape .project-launch{grid-column:2;grid-row:1;aspect-ratio:16/9}.work-card-landscape .work-meta{grid-column:1;grid-row:1;padding:0}.work-card-landscape h3{font-size:clamp(24px,3vw,43px);letter-spacing:-.06em}.work-card-landscape .project-summary{margin-top:20px;max-width:300px}
.work-kicker{font:10px/1.5 var(--mono)!important;letter-spacing:.04em;color:#ae3815!important;margin:0 0 20px!important}
.device-case{margin-top:110px;padding-top:45px;border-top:1px solid #bdb5a9}
.device-case-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.device-case h3{font:400 clamp(34px,4.9vw,72px)/1 var(--display);letter-spacing:-.065em;margin:0}.device-case h3 em{font-style:normal;color:#b63b16}.device-case-heading>.project-summary{font:10px/1.7 var(--mono);max-width:230px;color:#60594f}
.device-pair{display:grid;grid-template-columns:minmax(0,.8fr) 70px minmax(0,1.2fr);align-items:center;gap:12px}
.device-original{margin:0;position:relative;rotate:-3deg;box-shadow:8px 10px 0 #ded8cc;transition:rotate .7s}.device-original img{width:100%;height:auto;display:block}.device-original figcaption{position:absolute;bottom:0;left:0;right:0;background:rgba(17,17,15,.8);padding:12px;color:var(--paper);font:9px var(--mono)}
.device-pair>.project-launch{aspect-ratio:16/9}.device-arrow{font-size:55px;text-align:center;color:#bb3d18;display:inline-block}.device-case.gallery-entered .device-arrow{animation:device-arrow-enter 1s cubic-bezier(.2,.8,.2,1) both}.device-case:hover .device-original{rotate:0deg}
.ai-disclosure{font:11px/1.7 var(--sans);color:#655b50;max-width:740px;margin:28px 0 0;padding-left:15px;border-left:2px solid #bd3f1b}
.viewer-open{overflow:hidden}
.project-viewer{width:min(1120px,calc(100% - 40px));max-width:none;max-height:calc(100dvh - 36px);padding:0;border:1px solid #655247;background:#11110f;color:var(--paper);overflow:auto;overscroll-behavior:contain;box-shadow:0 30px 100px rgba(0,0,0,.5)}
.project-viewer::backdrop{background:rgba(9,9,8,.92);backdrop-filter:blur(12px)}.project-viewer[open]{animation:viewer-enter .4s cubic-bezier(.16,1,.3,1)}
.viewer-shell{padding:20px 28px 25px}.viewer-top{display:flex;align-items:center;gap:20px;font:9px/1.5 var(--mono);letter-spacing:.04em;padding-bottom:18px;border-bottom:1px solid var(--line)}.viewer-counter{color:var(--acid);white-space:nowrap}.viewer-category{flex:1;color:var(--muted)}
.viewer-close{display:flex;align-items:center;gap:12px;color:var(--paper);font:10px var(--mono);background:none;border:0;cursor:pointer;padding:0;margin-left:auto}.viewer-close>span{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;font:25px var(--sans);transition:rotate .3s,background .3s}.viewer-close:hover>span{rotate:90deg;background:var(--acid);color:var(--ink)}
.viewer-stage{position:relative;display:grid;place-items:center;margin:18px auto;background:#080808;min-height:200px}
.viewer-video{display:block;width:100%;height:min(58dvh,620px);object-fit:contain;background:#080808}.project-viewer[data-format=portrait] .viewer-stage{max-width:calc(58dvh * 9 / 16)}.project-viewer[data-format=portrait] .viewer-video{width:100%;aspect-ratio:9/16;height:min(58dvh,620px)}
.project-viewer[data-format=landscape] .viewer-video{height:auto;aspect-ratio:16/9;max-height:58dvh}
.viewer-error{position:absolute;inset:auto 12px 60px;padding:15px;background:#28201a;font-size:12px;line-height:1.6}.viewer-error[hidden]{display:none}.viewer-direct{color:var(--paper)}
.viewer-bottom{display:flex;gap:30px;align-items:start;justify-content:space-between;border-top:1px solid var(--line);padding-top:20px}.viewer-copy{max-width:780px}.viewer-copy h2{font:400 clamp(21px,3vw,37px)/1.1 var(--display);letter-spacing:-.05em;margin:0 0 10px}.viewer-summary{font:10px/1.6 var(--mono);color:var(--acid);margin:0 0 9px}.viewer-note{font-size:11px;line-height:1.6;color:var(--muted);margin:0}
.viewer-nav{display:flex;gap:9px;flex-shrink:0}.viewer-nav button{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;width:43px;height:43px;background:transparent;color:var(--paper);font-size:21px;cursor:pointer;transition:background .25s,translate .25s}.viewer-nav button:hover{background:var(--acid);color:var(--ink);translate:0 -3px}
@keyframes gallery-star{from{rotate:-160deg;scale:.5;opacity:0}to{rotate:0deg;scale:1;opacity:1}}@keyframes cut-arrive{from{clip-path:inset(0 100% 0 0);translate:-15px 0}to{clip-path:inset(0 0 0 0);translate:0 0}}@keyframes viewer-enter{from{opacity:0;translate:0 25px;scale:.97}to{opacity:1;translate:0 0;scale:1}}@keyframes device-arrow-enter{from{translate:-20px 15px;rotate:-30deg;opacity:0}to{translate:0 0;rotate:0deg;opacity:1}}
@media(max-width:950px){.work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 25px}.work-card:nth-child(3){margin-top:0}.work-card:nth-child(4){margin-top:75px}.work-card-landscape{gap:25px}.work-heading{gap:20px}.work-asterisk{font-size:70px}.device-pair{grid-template-columns:minmax(0,.85fr) 45px minmax(0,1.15fr);gap:8px}.device-arrow{font-size:40px}}
@media(max-width:600px){.work-heading{grid-template-columns:1fr auto;gap:20px;margin-bottom:40px}.work-heading>p{grid-column:1;grid-row:2;font-size:12px}.work-asterisk{grid-column:2;grid-row:1;font-size:65px}.work-heading h2{font-size:16vw}.work-grid{gap:35px 14px}.work-card{max-width:none;width:100%;margin-inline:0}.work-card:nth-child(2),.work-card:nth-child(4){margin-top:45px}.work-card:nth-child(3){margin-top:0}.work-meta h3{font-size:14px}.work-meta .project-summary{font-size:9px}.work-meta .excerpt-note{font-size:8px}.project-topline{top:10px;left:9px;right:9px;font-size:7px;gap:5px}.project-topline>span:first-child{max-width:90px}.project-play{left:9px;right:9px;bottom:10px;font-size:8px}.project-play>b{width:34px;height:34px;font-size:22px}.work-card-landscape{display:flex;flex-direction:column;margin-top:22px!important;gap:20px}.work-card-landscape .project-launch{width:100%}.work-card-landscape .work-meta{width:100%}.work-card-landscape h3{font-size:29px}.work-card-landscape .project-summary{margin-top:12px;max-width:none}.device-case{margin-top:65px;padding-top:30px}.device-case-heading{display:block;margin-bottom:30px}.device-case-heading>.project-summary{margin-top:20px;max-width:none}.device-case h3{font-size:10vw}.device-pair{grid-template-columns:1fr;gap:20px}.device-original{width:75%;margin-left:8px}.device-arrow{text-align:center;rotate:45deg;justify-self:center;font-size:35px}.device-case.gallery-entered .device-arrow{animation:none}.device-pair .project-launch .project-topline>span:first-child{max-width:none}.ai-disclosure{font-size:10px}.project-viewer{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.viewer-shell{padding:14px}.viewer-top{gap:10px;font-size:8px}.viewer-category{max-width:170px}.viewer-close{font-size:0;gap:0}.viewer-stage{margin-block:14px}.viewer-video{height:min(53dvh,480px)}.project-viewer[data-format=portrait] .viewer-stage{max-width:calc(53dvh * 9 / 16)}.project-viewer[data-format=portrait] .viewer-video{height:min(53dvh,480px)}.viewer-bottom{gap:14px}.viewer-copy h2{font-size:21px}.viewer-summary{font-size:9px}.viewer-note{font-size:10px}.viewer-nav{gap:5px}.viewer-nav button{width:32px;height:32px;font-size:18px}}
@media(max-width:360px){.work-grid{grid-template-columns:1fr}.work-card:nth-child(2),.work-card:nth-child(4){margin-top:0}.work-card:not(.work-card-landscape){max-width:270px;margin-inline:auto}}
@media(prefers-reduced-motion:reduce){.gallery-entered .work-asterisk,.gallery-entered h2 em,.project-viewer[open],.device-case.gallery-entered .device-arrow{animation:none}.project-launch>img,.project-launch:after,.project-play>b,.project-play>span,.device-original,.viewer-close>span,.viewer-nav button{transition:none}.project-launch:hover>img,.project-launch:focus-visible>img{scale:1}.project-launch:hover .project-play>b,.project-launch:focus-visible .project-play>b{rotate:0deg;scale:1}}
