/* Three Tapes / Selected work 2026: editorial filters, not boxed category tiles.
   All functional data-filter attributes and keyboard interactions remain unchanged. */
.mp-work .mp-filters{
  display:flex; align-items:stretch; flex-wrap:wrap; gap:10px 27px;
  border-bottom:1px solid rgba(203,183,241,.22);
  margin:8px 0 36px; padding:0;
}
.mp-work .mp-filters button{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  min-height:49px; padding:13px 0 17px;
  border:0!important; border-radius:0!important; background:transparent!important;
  color:#bfb7c9; box-shadow:none!important;
  font:600 13px/1.2 Arial,Helvetica,sans-serif; letter-spacing:.018em;
  white-space:nowrap; cursor:pointer;
  transition:color .24s ease, transform .24s ease;
}
.mp-work .mp-filters button::after{
  content:""; position:absolute; height:2px; bottom:-1px; left:0; right:0;
  background:#c7b8ff; transform:scaleX(0); transform-origin:center;
  transition:transform .28s cubic-bezier(.22,.8,.2,1);
}
.mp-work .mp-filters button:hover{color:#f3e9ff;transform:translateY(-1px)}
.mp-work .mp-filters button:hover::after{transform:scaleX(.55)}
.mp-work .mp-filters button.is-active{color:#e2d3ff;font-weight:700;transform:none}
.mp-work .mp-filters button.is-active::after{transform:scaleX(1)}
.mp-work .mp-filters button:focus-visible{outline:2px solid #c7b8ff;outline-offset:4px;border-radius:3px!important}
.mp-work .mp-project-media{border-radius:17px;isolation:isolate}
.mp-work .mp-project-media img{transition:transform .7s cubic-bezier(.22,.76,.2,1),filter .5s}
.mp-work .mp-project-open{right:16px;top:16px;box-shadow:0 7px 20px #08051055;transition:transform .24s ease}
.mp-work .mp-project:hover .mp-project-open{transform:translate(2px,-2px)}
@media(max-width:700px){
 .mp-work .mp-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;
  scrollbar-color:rgba(199,184,255,.45) transparent;overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;gap:22px;margin-right:0; padding-bottom:1px}
 .mp-work .mp-filters button{flex:none;scroll-snap-align:start;min-height:46px;font-size:12px}
 .mp-work .mp-project-media{border-radius:13px}
}
@media(prefers-reduced-motion:reduce){
 .mp-work .mp-filters button,.mp-work .mp-filters button::after,
 .mp-work .mp-project-open{transition:none!important}
}
