/* ==========================================================================
   pages/works-single.css — 事例詳細（/works/{slug}/）専用スタイル（担当C）
   DESIGN.md §2.2「事例タイトル（和・主見出し）36px」= タイトル帯のみ和文主・英字従の主従反転
   既存トークン・c-クラス（ennect.css）を再利用し、ページ固有の p-worksSingle__* のみ定義
   ========================================================================== */

/* --- タイトル帯 --------------------------------------------------------- */

/* 英字小ラベル WORKS（注記・年月日ロール 12px/500/0.17em） */
.p-worksSingle__pageLabel {
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--color-text-sub);
}

/* 業界タグ + 事例別英ラベルの横並び */
.p-worksSingle__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 17px;
  margin-top: 28px;
}
.p-worksSingle__enLabel {
  font-family: var(--font-en);
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: var(--color-text-sub);
}

/* 和文主見出し 36px/700/0.10em/1.5（和文最長約39字・2行組前提） */
.p-worksSingle__title {
  font-size: 3.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  margin-top: 20px;
}

/* リード文 */
.p-worksSingle__lead {
  max-width: 46em;
  margin-top: 28px;
  color: var(--color-text-mute);
}

/* --- 本文ブロック（SUMMARY〜POINT） ------------------------------------- */

.p-worksSingle__block + .p-worksSingle__block {
  margin-top: 80px;
}
.p-worksSingle__block p + p {
  margin-top: 16px;
}

/* APPROACH フェーズリスト */
.p-worksSingle__phases {
  margin-top: 20px;
}
.p-worksSingle__phases li + li {
  margin-top: 12px;
}

/* --- 関連導線 ----------------------------------------------------------- */

.p-worksSingle__related {
  margin-top: 80px;
}
.p-worksSingle__related a {
  text-decoration: underline;
  text-underline-offset: 0.25em;
  transition: opacity var(--transition);
}
.p-worksSingle__related a:hover {
  opacity: 0.8;
  text-decoration: none;
}

/* 前後事例ナビ（c-card 2カラム） */
.p-worksSingle__nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 40px;
}
.p-worksSingle__navItem {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.p-worksSingle__navLabel {
  font-size: 1.2rem;
  letter-spacing: 0.09em;
  color: var(--color-text-sub);
}
.p-worksSingle__navTitle {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.7;
  margin-top: 10px;
}
.p-worksSingle__navNote {
  font-size: 1.2rem;
  font-weight: 400;
  color: var(--color-text-sub);
}

/* --- SP ----------------------------------------------------------------- */

@media (max-width: 999px) {
  .p-worksSingle__meta {
    margin-top: 20px;
    gap: 12px;
  }
  .p-worksSingle__title {
    font-size: 2.4rem; /* DESIGN.md V3-01: SPは22〜24px */
  }
  .p-worksSingle__block + .p-worksSingle__block {
    margin-top: 60px;
  }
  .p-worksSingle__related {
    margin-top: 60px;
  }
  .p-worksSingle__nav {
    grid-template-columns: 1fr;
  }
}