.works-hero{padding:80px 0 60px}.works-title{font-family:var(--font-serif);font-size:clamp(40px,7vw,100px);font-weight:300;line-height:1.05;letter-spacing:-.02em;margin-top:16px}.works-desc{margin-top:24px;max-width:480px;font-size:15px;color:var(--color-muted);line-height:1.9}.filter-wrap{padding-bottom:56px}.filter-header{border-top:1px solid var(--color-border);padding-top:28px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}.filter-label{font-size:10px;letter-spacing:.2em;color:var(--color-muted);font-weight:500;white-space:nowrap;flex-shrink:0}.filter-row{display:flex;flex-wrap:wrap;gap:8px;flex:1}.filter-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 18px;border:1px solid var(--color-border);background:transparent;font-size:11px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;border-radius:100px;transition:all .25s ease;font-family:var(--font-sans);color:var(--color-muted);white-space:nowrap}.filter-dot{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:0;transition:opacity .25s;flex-shrink:0}.filter-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.filter-btn.active{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.filter-btn.active .filter-dot{opacity:1;background:#fff}.works-grid-section{padding-bottom:120px}.works-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px}.work-item{display:block;min-width:0}.work-item.hidden{display:none}.work-card{display:block;text-decoration:none;animation:workFadeIn .8s cubic-bezier(.19,1,.22,1) both}@keyframes workFadeIn{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}.work-thumb{position:relative;overflow:hidden;background:var(--color-surface);width:100%;padding-top:66.67%;border-radius:4px}.work-img{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .9s cubic-bezier(.19,1,.22,1)}.work-overlay{position:absolute;inset:0;background:linear-gradient(to top,#0000008c,#0000 50%);opacity:0;transition:opacity .4s ease}.work-hover-info{position:absolute;bottom:0;left:0;right:0;padding:20px 20px 18px;transform:translateY(8px);opacity:0;transition:all .35s cubic-bezier(.19,1,.22,1);display:flex;align-items:flex-end;justify-content:space-between;gap:8px}.work-hover-client{font-family:var(--font-serif);font-size:14px;color:#fff;font-weight:400;line-height:1.3}.work-hover-link{display:inline-flex;align-items:center;gap:5px;background:#ffffff26;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);padding:5px 12px;border-radius:100px;font-size:10px;color:#fff;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;flex-shrink:0}.work-card:not(.work-card-static):hover .work-img{transform:scale(1.05)}.work-card:not(.work-card-static):hover .work-overlay{opacity:1}.work-card:not(.work-card-static):hover .work-hover-info{opacity:1;transform:translateY(0)}.work-card-static{cursor:default}.work-card-static .work-thumb{pointer-events:none}.work-meta{margin-top:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.work-meta-left{flex:1;min-width:0}.work-client{font-family:var(--font-serif);font-size:15px;font-weight:400;line-height:1.4;color:var(--color-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-title-text{font-size:11px;color:var(--color-muted);letter-spacing:.04em;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-meta-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}.work-year{font-size:11px;color:var(--color-muted);letter-spacing:.06em;font-variant-numeric:tabular-nums}.work-tag-first{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);border:1px solid var(--color-border);padding:2px 7px;border-radius:100px;white-space:nowrap}@media(max-width:1024px){.works-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 20px}}@media(max-width:900px){.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px}}@media(max-width:560px){.works-grid{grid-template-columns:minmax(0,1fr);gap:40px}.filter-header{gap:14px}}
