/* ==========================================================================
   農知島 case page — page-specific additions (loaded after site.css)
   Uses only site tokens. Moss is this page's small secondary accent.
   ========================================================================== */
.case-nongzhidao { --accent-2: var(--moss); }

/* 資料 → 角色 → 工具: three steps with arrows between them */
.nzd-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px; }
.nzd-flow li { padding: 22px 22px 24px; }
.nzd-flow li + li::before {
  content: "→";
  position: absolute; left: -32px; top: 50%; transform: translateY(-50%);
  font-family: var(--f-latin); font-size: 1.25rem; color: var(--ink-3);
}
.nzd-flow .flow__num { letter-spacing: .08em; }
.nzd-flow .flow__num i { font-style: normal; color: var(--ink-2); font-weight: 500; }
.nzd-flow .flow__title { font-size: 1.1875rem; letter-spacing: .06em; }
.nzd-flow .flow__text { font-size: .9375rem; line-height: 1.85; }

/* 角色牆: character tiles cut from the original illustrations */
.case-section > * + .nzd-cast { margin-top: clamp(32px, 4vw, 56px); }
.nzd-cast__list {
  list-style: none;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 16px);
}
.nzd-cast__item {
  background: var(--card);
  border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; text-align: center;
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.nzd-cast__item img { width: 100%; aspect-ratio: 1 / 1; }
.nzd-cast__name {
  display: block; padding: 0 8px 14px;
  font-size: .9375rem; font-weight: 500; letter-spacing: .08em;
}
.nzd-cast figcaption { margin-top: 14px; font-size: .8125rem; color: var(--ink-2); line-height: 1.7; max-width: var(--measure); }
@media (hover: hover) {
  .nzd-cast__item:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--ink-3); }
}

/* a figure directly after another figure block sits a little closer */
.case-section > .figure + .figure,
.case-section > .figure + .figure-grid,
.case-section > .figure-grid + .figure { margin-top: clamp(24px, 3vw, 40px); }

/* closing line of 專案成果 */
.case-section > .stats + .prose { margin-top: clamp(28px, 3.4vw, 44px); }

@media (max-width: 767.98px) {
  .nzd-flow { grid-template-columns: 1fr; gap: 36px; }
  .nzd-flow li + li::before { content: "↓"; left: 50%; top: -30px; transform: translateX(-50%); }
  .nzd-cast__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nzd-cast__name { padding-bottom: 10px; font-size: .875rem; }
}

@media (prefers-reduced-motion: reduce) {
  .nzd-cast__item:hover { transform: none; }
}
