/* works-page.css */

.works-page {
  background: var(--color-white);
  padding-bottom: 5rem;
}

/* --- グリッドアイテムのリンク化 --- */
.works-grid__link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.works-grid__link:hover .works-grid__img {
  transform: scale(1.04);
  transition: transform .4s ease;
}

.works-grid__img-wrapper {
  overflow: hidden;
}

/* ==========================================================================
   SINGLE WORKS（実績詳細ページ）
   ========================================================================== */
.single-works {
  background: var(--color-white);
  padding-bottom: 5rem;
}

.single-works__hero {
  width: 100%;
  max-height: 32rem;
  overflow: hidden;
}

.single-works__hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.single-works__body {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 3.75rem 1.5rem;
}

.single-works__title {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 1.75rem;
  line-height: 2;
  letter-spacing: .25rem;
  color: var(--color-primary);
  margin-bottom: 2rem;
}

.single-works__content {
  font-size: 1rem;
  line-height: 2;
  color: var(--color-black);
  margin-bottom: 3rem;
}

.single-works__back {
  text-align: center;
  margin-top: 3rem;
}

.nav-links {
  margin-top: 2rem;
  text-align: center;
}

@media (max-width: 768px) {
  .single-works__title {
    font-size: 1.25rem;
  }
}