/* Стиль страницы /projects/ — обзорный список со фильтром */
.pi-head{padding:140px 20px 60px;background:var(--paper)}
.pi-head-inner{max-width:1200px;margin:0 auto}
.pi-back{display:inline-block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);border-bottom:1px solid var(--line);padding-bottom:3px;margin-bottom:32px;transition:color .2s,border-color .2s}
.pi-back:hover{color:var(--accent);border-color:var(--accent)}
.pi-head .eyebrow{color:var(--accent);font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;margin-bottom:18px}
.pi-head h1{font-family:'NAMU',sans-serif;font-weight:600;font-size:clamp(36px,5.5vw,68px);line-height:1.05;letter-spacing:-.005em;margin-bottom:24px;color:var(--ink)}
.pi-lead{font-size:clamp(15px,1.6vw,18px);line-height:1.55;color:var(--mute);max-width:680px;margin-bottom:44px}
.pi-filters{display:flex;flex-wrap:wrap;gap:8px}
.pi-filters .filter-btn{padding:10px 18px;font-family:'NAMU',sans-serif;font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);background:transparent;border:1px solid var(--line);border-radius:999px;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.pi-filters .filter-btn:hover{color:var(--ink);border-color:var(--ink)}
.pi-filters .filter-btn.active{color:var(--paper);background:var(--ink);border-color:var(--ink)}
.pi-grid-section{padding:0 20px 120px;background:var(--paper)}
.pi-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:56px}
@media(min-width:720px){.pi-grid{grid-template-columns:repeat(2,1fr);gap:64px 40px}}
@media(min-width:1080px){.pi-grid{grid-template-columns:repeat(3,1fr);gap:64px 32px}}
.pi-grid .card{display:block;cursor:pointer;transition:opacity .4s var(--ease-out)}
.pi-grid .card.hidden{display:none}
.pi-grid .card .ph{aspect-ratio:4/5;overflow:hidden;background:var(--line);margin-bottom:18px}
.pi-grid .card .ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.2s var(--ease-out)}
.pi-grid .card:hover .ph img{transform:scale(1.06)}
.pi-grid .card .tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:8px}
.pi-grid .card h3{font-family:'NAMU',sans-serif;font-weight:600;font-size:22px;line-height:1.2;color:var(--ink);margin-bottom:8px;transition:color .2s}
.pi-grid .card:hover h3{color:var(--accent)}
.pi-grid .card p{font-size:14px;color:var(--mute);line-height:1.5}
.pi-empty{max-width:1200px;margin:80px auto;text-align:center;font-size:16px;color:var(--mute)}
