/* Fix3（2026-10-14）：Testimonials Columns（21st.dev @efferd/components/testimonials-columns-1、MIT）を /case-studies/ の相談者の声へ移植。
   原作の構成と寸法：見出し群は中央揃え（枠付きの小さなバッジ・見出し・説明 max-w 540px）、40px 下に列の外枠（列の間 24px、最大の高さ 740px、
   上下 25% をマスクでフェード、はみ出しは隠す）。各列は translateY(0→-50%) の一定速度のループ（同じ並びを 2 回続けて継ぎ目なし）。
   カードは白・角丸 24px（rounded-3xl）・1px の枠・shadow-lg（0 10px 15px -3px／0 4px 6px -4px、primary の 10%）・余白 40px・最大幅 320px、
   下に 40px の丸（原作は顔写真）と名前・役割（行間 20px、役割は 60% の濃さ）。
   このサイトに合わせたところ：文字色は TOP の #1b1813、枠は原作の #e5e5e5、声の文は明朝。顔写真の代わりに声の番号の丸（人物画像なし）。
   列は原作の幅の基準（1024px 以上 3 列・768px 以上 2 列・モバイル 1 列）で、1 列に 2 件以上入る数まで（掲載 4 件では PC・タブレット 2 列、
   モバイル 1 列。1 件だけの列は複製と同時に同じ声が 2 回見えるため）。列の速度は高さに合わせ、原作の速さ（約 47px／秒）と列ごとの比。
   Fix4（2026-10-14）：舞台は原作の最大の高さ 740px（全幅。Fix3 のモバイル 620px・JS で下げる高さは取り下げ）。一時停止のボタン・自動停止は削除。動きを減らす設定・JS 停止時は 4 件を静的に並べる（複製・マスクなし）。 */
.hal-tc{--tc-fg:#1b1813;--tc-text:#3d3931;--tc-muted:#6b6356;--tc-line:#e5e5e5;
  box-sizing:border-box;padding:80px 0;background:#fff;color:var(--tc-fg)}
.hal-tc *,.hal-tc *::before,.hal-tc *::after{box-sizing:border-box}
.hal-tc__inner{max-width:1040px;margin:0 auto;padding:0 24px}
.hal-tc__head{display:flex;flex-direction:column;align-items:center;max-width:540px;margin:0 auto;text-align:center}
.hal-tc__badge{display:inline-block;margin:0;padding:4px 16px;border:1px solid var(--tc-line);border-radius:8px;font-family:var(--hal-mono,'Space Mono',monospace);font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--tc-muted)}
.hal-lp .hal-tc .hal-tc__title{margin:20px 0 0;padding:0;border:0;background:none;font-family:var(--hal-serif,'Zen Old Mincho',serif);font-size:clamp(24px,3.2vw,40px);font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--tc-fg)}
.hal-lp .hal-tc .hal-tc__title::before,.hal-lp .hal-tc .hal-tc__title::after{content:none}
.hal-tc__lead{margin:20px 0 0;font-size:14px;line-height:1.85;color:var(--tc-muted)}
.hal-tc__stage{margin-top:40px}
.hal-tc__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),320px));justify-content:center;gap:24px;margin:0;padding:0;list-style:none}
/* Fix4 V01：カードの枠を黒に（太さ 1px は同じ） */
.hal-tc__card{display:flex;flex-direction:column;width:100%;max-width:320px;margin:0;padding:40px;border:1px solid #000;border-radius:24px;background:#fff;
  box-shadow:0 10px 15px -3px rgba(23,23,23,.1),0 4px 6px -4px rgba(23,23,23,.1);list-style:none}
.hal-tc__card::marker{content:''}
.hal-tc__text{margin:0;font-family:var(--hal-serif,'Zen Old Mincho',serif);font-size:16px;font-weight:500;line-height:1.85;letter-spacing:.02em;color:var(--tc-fg)}
/* Fix4 V01：「全文と調査事例を読む」は Interactive Hover Button（fix4-buttons.css）。ここでは置き場所と文字の大きさだけ */
.hal-lp .hal-tc .hal-tc__more.hal-ihb{align-self:flex-start;margin-top:16px;font-size:13px;min-height:40px}
.hal-tc__who{display:flex;align-items:center;gap:8px;margin-top:20px}
.hal-tc__avatar{display:grid;place-items:center;flex:0 0 auto;width:40px;height:40px;border:1px solid var(--tc-line);border-radius:999px;background:#fff;font-family:var(--hal-mono,'Space Mono',monospace);font-size:12px;font-weight:700;color:var(--tc-fg)}
.hal-tc__whotext{display:flex;flex-direction:column;min-width:0}
.hal-tc__name{font-size:14px;font-weight:500;line-height:20px;letter-spacing:-.01em;color:var(--tc-fg)}
.hal-tc__role{font-size:13px;line-height:20px;letter-spacing:-.01em;color:var(--tc-fg);opacity:.6}
/* Fix4 V02：「声の動きを一時停止／再開」ボタンとその規則は削除した（自動の動きは止めない仕様） */

/* JS が動くとき：列のループ（testimonials-columns.js が .is-running と列を作る） */
.hal-tc__stage.is-running{display:flex;justify-content:center;gap:24px;max-height:740px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent)}
.hal-tc__stage.is-running .hal-tc__list{display:none}
.hal-tc__col{flex:0 1 320px;min-width:0}
.hal-tc__track{display:flex;flex-direction:column;gap:24px;padding-bottom:24px;margin:0;list-style:none;animation:hal-tc-scroll var(--tc-dur,15s) linear infinite;will-change:transform}
.hal-tc__track .hal-tc__card{max-width:none}
@keyframes hal-tc-scroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@media (prefers-reduced-motion:reduce){.hal-tc__track{animation:none}}

/* モバイルの詰め（上の規則より後に置く） */
@media (max-width:767.98px){
  .hal-tc{padding:40px 0}
  .hal-tc__inner{padding:0 16px}
  .hal-tc__lead{margin-top:14px;font-size:13px;line-height:1.8}
  .hal-tc__stage{margin-top:24px}
  .hal-tc__card{padding:28px 24px}
  .hal-tc__text{font-size:15px}
  .hal-tc__col{flex-basis:100%}
}
