nav.links a.current{background:var(--pink-soft);}

.page-head{
  padding:76px 0 46px;
  text-align:center;
}
.page-head .eyebrow{color:var(--pink);}
.page-head h1{
  margin-top:6px;
  font-size:clamp(2rem,5vw,3rem);
}
.page-head p:last-child{
  margin-top:8px;
  color:var(--ink-soft);
}

.works-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin-bottom:76px;
}
.work-item{
  overflow:hidden;
  background:var(--white);
  border-radius:var(--radius-md);
  box-shadow:0 5px 0 rgba(85,73,74,.05);
  transition:transform .2s ease,box-shadow .2s ease;
}
.work-item:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 16px rgba(85,73,74,.08);
}
.work-visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  aspect-ratio:4/3;
  border-bottom:2px dashed rgba(85,73,74,.08);
}
.work-visual::after{
  content:"";
  position:absolute;
  width:110px;
  height:110px;
  border:3px dashed rgba(255,255,255,.7);
  border-radius:50%;
  transform:rotate(-12deg);
}
.work-visual.has-thumbnail::after{display:none;}
.work-thumbnail{
  width:100%;
  height:100%;
  object-fit:cover;
}
.work-thumbnail.is-contain{
  background:var(--white);
  object-fit:contain;
}
.work-visual-icon{
  position:relative;
  z-index:1;
  font-size:3rem;
  filter:drop-shadow(0 3px 0 rgba(85,73,74,.08));
}
.work-category{
  position:absolute;
  z-index:2;
  left:0;
  bottom:14px;
  padding:5px 16px 5px 13px;
  color:var(--pink);
  background:var(--white);
  border-radius:0 999px 999px 0;
  font-family:'M PLUS Rounded 1c',sans-serif;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.06em;
}
.work-item:nth-child(4n+1) .work-visual{background:var(--pink-soft);}
.work-item:nth-child(4n+2) .work-visual{background:var(--orange-soft);}
.work-item:nth-child(4n+3) .work-visual{background:var(--mint-soft);}
.work-item:nth-child(4n) .work-visual{background:var(--lavender-soft);}
.work-content{padding:18px 20px 22px;}
.work-year{
  margin-bottom:5px;
  color:var(--ink-soft);
  font-family:'M PLUS Rounded 1c',sans-serif;
  font-size:.75rem;
  font-weight:700;
}
.work-title{
  font-family:'M PLUS Rounded 1c',sans-serif;
  font-size:1.02rem;
  font-weight:800;
}
.work-title[href]::after{
  content:"↗";
  margin-left:6px;
  color:var(--pink);
  font-size:.8em;
}
.work-title[href]:hover{color:var(--pink);}
.work-content p{
  margin-top:5px;
  color:var(--ink-soft);
  font-size:.9rem;
}
.work-result{color:var(--pink);font-weight:700;}

.back-home{margin-bottom:76px;text-align:center;}
.works-page .btn{
  color:inherit;
  background:var(--white);
  border:2px solid var(--lavender);
  font-size:1rem;
  transition:background .2s ease,transform .2s ease;
}
.works-page .btn:hover{
  background:var(--lavender-soft);
  transform:translateY(-2px);
}
.works-page footer{border-top:2px dashed var(--pink-soft);}

@media (max-width:820px){
  .works-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:520px){
  .page-head{padding-top:58px;}
  .works-grid{grid-template-columns:1fr;gap:18px;}
  .work-visual{aspect-ratio:16/9;}
}
@media (prefers-reduced-motion:reduce){
  .work-item{transition:none;}
}