/* ================================
   Design Works Page
================================ */
.dw-page {

}
.dw-page .container {
  width: min(calc(100% - (var(--side) * 2)), 1440px);
}
.dw-hero {
  padding-block: clamp(142px, 15vw, 204px) clamp(92px, 10vw, 120px);
}
.dw-hero h1 {
  margin: 0;
  font-family: var(--font-en);
  font-size: clamp(58px, 8.6vw, 130px);
  line-height: 0.98;
  letter-spacing: -0.02em;
  font-weight: bold;
}
.dw-list {
  padding-bottom: clamp(110px, 13vw, 160px);
}
.dw-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 42px 32px;
}
.work-card {
  display: block;
}
.work-card img {
  width: 100%;
  object-fit: cover;
  background: #ddd;
}
.work-card strong {
  display: block;
  margin-top: 12px;
  font-family: var(--font-en);
  font-size: clamp(20px, 2.2vw, 20px);
  line-height: 1.15;
}
@media (max-width: 960px) {
  .dw-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .dw-page .container {
    width: calc(100% - 32px);
  }
  .dw-hero {
    padding-block: 104px 70px;
  }
  .dw-hero h1 {
    font-size: clamp(54px, 15vw, 68px);
  }
  .dw-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }
  .dw-card strong {
    padding-left: 14px;
    font-size: 26px;
  }
}