.portfolio-page .cat-head{background:var(--deep)}

.pf-filter{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:0 20px 32px}
.pf-tab{font:500 .88rem var(--font);padding:9px 20px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.pf-tab:hover{background:var(--soft);border-color:var(--brass)}
.pf-tab.active{background:var(--ink);color:#fff;border-color:var(--ink)}

.pf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:18px;padding:0 clamp(16px,4vw,48px) 60px;max-width:1280px;margin:0 auto}

.pf-item{border-radius:14px;overflow:hidden;background:var(--soft);cursor:pointer;animation:pg .6s var(--ease) backwards;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.pf-item:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.pf-item.pf-in{animation:pf-pop .5s var(--ease) backwards}
@keyframes pf-pop{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.pf-thumb{aspect-ratio:4/3;overflow:hidden;position:relative;background:#d8d8d8}
.pf-thumb img,.pf-thumb video{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pf-item:hover .pf-thumb img,.pf-item:hover .pf-thumb video{transform:scale(1.04)}

.pf-video-wrap{position:relative}
.pf-play{position:absolute;inset:0;display:grid;place-items:center;font-size:2rem;color:#fff;background:rgba(0,0,0,.25);opacity:0;transition:opacity .3s}
.pf-item:hover .pf-play{opacity:1}

.pf-info{padding:16px 18px 18px;display:grid;gap:4px}
.pf-info h3{font-size:1.05rem;font-weight:500}
.pf-info span{font-size:.85rem;color:var(--ink2)}

/* Lightbox */
.pf-lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.88);display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pf-lightbox.open{opacity:1;visibility:visible;transition-delay:0s}
.pf-lb-close{position:absolute;top:20px;right:24px;font-size:2rem;color:#fff;background:none;border:0;cursor:pointer;z-index:2;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;transition:background .2s}
.pf-lb-close:hover{background:rgba(255,255,255,.15)}
.pf-lb-content img,.pf-lb-content video{border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}

/* CTA */
.pf-cta{text-align:center;padding:80px clamp(16px,4vw,48px) 80px;background:var(--soft)}
.pf-cta h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:500;margin-bottom:10px}
.pf-cta p{color:var(--ink2);margin-bottom:32px;font-size:1rem}
.pf-cta .ctas{margin:0 auto}

@media(max-width:860px){
  .pf-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
}
@media(max-width:380px){
  .pf-grid{padding-left:12px;padding-right:12px}
}
@media(prefers-reduced-motion:reduce){
  .pf-item,.pf-item.pf-in{animation:none}
  .pf-item:hover{transform:none}
}