.works-masonry{columns:3;column-gap:18px}
.work-filter-item{break-inside:avoid;margin:0 0 18px;transition:opacity .3s,transform .3s}
.work-filter-item.is-hidden{display:none}
.work-card{margin:0}
.work-card__link{display:block}
.work-card__image{position:relative;overflow:hidden;background:#f0f5f8;aspect-ratio:1/1}
.work-card__image img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .6s cubic-bezier(.2,.6,.2,1);image-rendering:auto}
.work-card__overlay{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;align-items:flex-end;gap:15px;padding:42px 16px 14px;color:#fff;background:linear-gradient(transparent,rgba(40,30,33,.52));opacity:0;transform:translateY(5px);transition:.35s}
.work-card__overlay h3{font-family:var(--sans);font-size:11px;font-weight:400;margin:0;text-shadow:0 1px 8px rgba(0,0,0,.2)}
.work-card__overlay span{font-size:16px}
.work-card__link:hover img{transform:scale(1.015)}
.work-card__link:hover .work-card__overlay{opacity:1;transform:none}
.work-card__placeholder{aspect-ratio:1/1;background:linear-gradient(135deg,#edf5fa,#f8fbfd);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--pink);font-family:var(--sans);letter-spacing:.08em}.work-card__placeholder small{font-family:var(--sans);font-size:8px;color:var(--muted);letter-spacing:0;margin-top:8px}
.empty-state{column-span:all;text-align:center;padding:110px 20px;border:1px solid var(--line);background:#fff}
.empty-state span{color:var(--pink);font-size:20px}
.empty-state p{font-family:var(--sans);font-size:13px;margin:10px 0 2px}
.empty-state small{font-family:var(--sans);font-size:10px;color:var(--muted)}
.archive-works{padding-bottom:20px}
.single-work{max-width:1050px;padding:90px 0 130px}
.single-work__header{text-align:center;position:relative;margin-bottom:65px}
.single-work__header h1{font-family:var(--sans);font-size:clamp(36px,5vw,62px);font-weight:400;margin:0 0 15px}
.single-work__meta{font-size:9px;color:var(--muted);letter-spacing:.08em}
.single-work__meta a{color:var(--muted)}
.back-link{position:absolute;left:0;top:0;font-size:10px;color:var(--muted);letter-spacing:.08em}
.single-work__main{margin:0 auto 65px;text-align:center}
.single-work__main img{max-height:1100px;width:auto;margin:auto}
.single-work__content{max-width:700px;margin:0 auto 80px}
.work-nav{border-top:1px solid var(--line);padding-top:28px;display:grid;grid-template-columns:1fr 40px 1fr;align-items:center;font-size:10px;letter-spacing:.08em;color:var(--muted)}
.work-nav>span{text-align:center;color:var(--pink)}
.work-nav>div:last-child{text-align:right}
@media(max-width:900px){.works-masonry{columns:2}}
@media(max-width:560px){
  .works-masonry{columns:2;column-gap:9px}.work-filter-item{margin-bottom:9px}
  .work-card__overlay{display:none}
  .single-work{padding-top:65px}
  .back-link{position:static;display:block;text-align:left;margin-bottom:45px}
}


/* =========================================
   v1.9 Stable collection grid
   CSS columns は要素数・高さによって列の見え方が変わるため使用しない。
========================================= */
.collection-grid,
.works-home-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  align-items:start;
}
.collection-grid .work-filter-item,
.works-home-grid .work-filter-item{
  width:100%;
  min-width:0;
  margin:0;
  break-inside:auto;
}
.collection-grid .work-card,
.works-home-grid .work-card{
  width:100%;
  margin:0;
}
.collection-grid .work-card__image,
.works-home-grid .work-card__image{
  width:100%;
  aspect-ratio:1 / 1;
}

@media(max-width:820px){
  .collection-grid,
  .works-home-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
}
@media(max-width:520px){
  .collection-grid,
  .works-home-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
}
