/* =========================================================
   施工実績
   ========================================================= */
.filter { display: flex; flex-wrap: wrap; gap: 10px; }
.filter__btn {
  min-height: 44px; padding: 0 22px;
  font-size: 14px; letter-spacing: .1em;
  border: 1px solid var(--c-line); background: var(--c-white); color: var(--c-ink);
  transition: background-color .3s, color .3s, border-color .3s;
}
.filter__btn:hover { border-color: var(--c-ink); }
.filter__btn[aria-pressed="true"] { background: var(--c-lacquer); border-color: var(--c-lacquer); color: var(--c-pearl); }
.filter__status { margin: 14px 0 36px; font-size: 13px; color: var(--c-mute); min-height: 1.9em; }

.cases { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px, 6vw, 72px) clamp(24px, 4vw, 48px); }
.case[hidden] { display: none; }
.case__photo { aspect-ratio: 4 / 3; overflow: hidden; background: var(--c-sand); }
.case__photo img { width: 100%; height: 100%; object-fit: cover; }
.case__body { padding-top: 22px; }
.case__cat { font-size: 12px; letter-spacing: .16em; color: var(--c-brass); }
.case__title { font-family: var(--ff-serif); font-weight: 500; font-size: 22px; letter-spacing: .06em; line-height: 1.55; margin-top: 4px; }
.case__meta { display: flex; gap: 14px; margin-top: 12px; font-size: 13px; }
.case__meta dt { color: var(--c-brass); }
.case__meta dt::after { content: "："; }
.case__text { margin-top: 8px; font-size: 15px; color: var(--c-mute); }
.works-list__note { margin-top: 64px; font-size: 14px; color: var(--c-mute); }
@media (max-width: 767px) { .cases { grid-template-columns: 1fr; } }