/* =========================================================
  case-detail.css
  - CASE詳細ページ専用（必ずスコープ）
  - cases.css と同トーンで “事例紹介”の型にする
========================================================= */

body.page.page-case-detail .container{ max-width:1120px; }
body.page.page-case-detail .caseDetail-wrap{ max-width:980px; }

/* =================================
  HERO（cases と同じ空気）
================================= */

body.page.page-case-detail .cases-hero.caseHero{
  position:relative; overflow:hidden;
  padding:clamp(84px,10vh,120px) 0 clamp(56px,8vh,88px);
}
body.page.page-case-detail .cases-heroBg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(900px 420px at 18% 18%, rgba(244,183,64,.14), transparent 64%),
    radial-gradient(900px 520px at 82% 32%, rgba(47,127,111,.18), transparent 66%),
    radial-gradient(760px 420px at 50% 80%, rgba(111,143,122,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.84));
}
body.page.page-case-detail .cases-heroBg::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:var(--noise);
  opacity:.45; mix-blend-mode:multiply;
}
body.page.page-case-detail .cases-heroInner{ position:relative; z-index:1; max-width:980px; }

body.page.page-case-detail .caseHero-breadcrumb{ margin-bottom:8px; }
body.page.page-case-detail .caseHero-breadcrumb a{ color:rgba(0,0,0,.62); font-size:13px; text-decoration:none; }
body.page.page-case-detail .caseHero-breadcrumb a:hover{ text-decoration:underline; }

body.page.page-case-detail .caseHero-kicker{
  margin:0 0 8px;
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(0,0,0,.58);
}
body.page.page-case-detail .caseHero-title{
  font-family:"Noto Serif JP", serif;
  font-size:clamp(34px,4.2vw,52px);
  line-height:1.22;
  margin:0 0 10px;
}
body.page.page-case-detail .caseHero-metaLine{
  margin:0 0 14px;
  color:rgba(0,0,0,.66);
  line-height:1.8;
}

body.page.page-case-detail .caseHero-thumb{
  border-radius:18px; overflow:hidden;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 44px rgba(0,0,0,.08);
  background:rgba(255,255,255,.85);
}
body.page.page-case-detail .caseHero-thumb img{ width:100%; height:auto; display:block; object-fit:cover; }

body.page.page-case-detail .caseHero-pills{
  margin-top:14px;
  display:flex; flex-wrap:wrap; gap:8px;
}
body.page.page-case-detail .metaPill{
  display:inline-flex; align-items:center;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.06);
  font-size:12px;
  color:rgba(0,0,0,.72);
  box-shadow:0 10px 22px rgba(0,0,0,.05);
}

/* =================================
  SUMMARY（事例紹介の型）
================================= */

body.page.page-case-detail .caseSummary{
  margin-top: 10px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
body.page.page-case-detail .sumCard{
  border-radius:18px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 44px rgba(0,0,0,.08);
  padding:16px 16px 14px;
  backdrop-filter: blur(10px);
}
body.page.page-case-detail .sumCard.is-accent{
  background:
    radial-gradient(520px 220px at 22% 18%, rgba(244,183,64,.18), transparent 62%),
    rgba(255,255,255,.86);
  border-color: rgba(47,127,111,.14);
}
body.page.page-case-detail .sumCard .k{
  margin:0 0 8px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(0,0,0,.58);
}
body.page.page-case-detail .sumCard .t{
  margin:0;
  line-height:1.85;
  color:rgba(0,0,0,.76);
}

/* =================================
  BODY CARD
================================= */

body.page.page-case-detail .caseBodyCard{
  margin-top:16px;
  border-radius:22px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 44px rgba(0,0,0,.08);
  padding:22px;
  backdrop-filter: blur(10px);
}

body.page.page-case-detail .caseBlock + .caseBlock{
  margin-top:20px;
  padding-top:20px;
  border-top:1px solid rgba(0,0,0,.06);
}

body.page.page-case-detail .caseBlock-head .cap{
  margin:0 0 6px;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(0,0,0,.58);
}
body.page.page-case-detail .caseBlock h2{
  margin:0 0 10px;
  font-family:"Noto Serif JP", serif;
  font-size:20px;
  line-height:1.4;
}
body.page.page-case-detail .caseBlock p{
  margin:0;
  line-height:1.9;
  color:rgba(0,0,0,.74);
}

/* 論点・結果 */
body.page.page-case-detail .issueGrid,
body.page.page-case-detail .resultGrid{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
}
body.page.page-case-detail .issue,
body.page.page-case-detail .result{
  border-radius:16px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  padding:14px 14px 12px;
}
body.page.page-case-detail .issue .k,
body.page.page-case-detail .result .k{
  margin:0 0 6px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(184,138,26,.92);
}
body.page.page-case-detail .issue .t,
body.page.page-case-detail .result .t{
  margin:0;
  line-height:1.75;
  color:rgba(0,0,0,.76);
  font-weight:700;
}

/* ステップライン */
body.page.page-case-detail .stepLine{
  margin:12px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}
body.page.page-case-detail .step{
  border-radius:16px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  padding:14px 14px 12px;
}
body.page.page-case-detail .step .no{
  margin:0 0 6px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(184,138,26,.92);
}
body.page.page-case-detail .step .t{
  margin:0 0 6px;
  font-weight:800;
  line-height:1.6;
}
body.page.page-case-detail .step .d{
  margin:0;
  color:rgba(0,0,0,.72);
  line-height:1.8;
}

/* 注釈ボックス */
body.page.page-case-detail .noteBox{
  margin-top:14px;
  border-radius:16px;
  border:1px solid rgba(47,127,111,.16);
  background:
    radial-gradient(640px 220px at 22% 18%, rgba(47,127,111,.16), transparent 62%),
    rgba(255,255,255,.9);
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  padding:14px 14px 12px;
}
body.page.page-case-detail .noteBox .k{
  margin:0 0 6px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(47,127,111,.95);
}
body.page.page-case-detail .noteBox .t{ margin:0; line-height:1.8; color:rgba(0,0,0,.74); }

/* CTA */
body.page.page-case-detail .caseDetail-cta{
  margin-top:16px;
  border-radius:22px;
  background:rgba(47,127,111,.92);
  color:#fff;
  padding:26px;
  box-shadow:0 24px 60px rgba(0,0,0,.12);
}
body.page.page-case-detail .caseDetail-cta .kicker,
body.page.page-case-detail .caseDetail-cta .title,
body.page.page-case-detail .caseDetail-cta .note{ color:#fff; }
body.page.page-case-detail .caseDetail-cta .title{ font-weight:800; margin:0 0 8px; }
body.page.page-case-detail .caseDetail-cta .note{ margin:0; opacity:.9; }

/* Responsive */
@media (max-width: 980px){
  body.page.page-case-detail .caseSummary{ grid-template-columns: 1fr; }
  body.page.page-case-detail .issueGrid,
  body.page.page-case-detail .resultGrid{ grid-template-columns: 1fr; }
  body.page.page-case-detail .caseBodyCard{ padding:18px; }
}