.intro-box {
  padding:32px 34px;
  border-radius:var(--radius);
  background:#fff;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
}

.intro-box p {
  margin:0 0 14px;
  color:#344253;
  font-size:1rem;
  line-height:1.8;
}

.intro-box p:last-child {
  margin-bottom:0;
}

.case-index {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.index-card {
  display:block;
  min-height:190px;
  padding:24px;
  border-radius:var(--radius);
  background:#fff;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  transition:transform .18s ease,box-shadow .18s ease;
}

.index-card:hover {
  transform:translateY(-3px);
  box-shadow:0 18px 42px rgba(23,42,74,.13);
}

.index-no {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:60px;
  height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(31,111,178,.1);
  color:var(--blue-dark);
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.04em;
}

.index-card h3 {
  margin:14px 0 8px;
  color:var(--navy);
  font-size:1.04rem;
  line-height:1.45;
}

.index-card p {
  margin:0;
  color:var(--sub);
  font-size:.94rem;
  line-height:1.68;
}

.case-list {
  display:grid;
  gap:34px;
}

.case-card {
  overflow:hidden;
  border-radius:var(--radius);
  background:#fff;
  border:1px solid var(--border);
  box-shadow:var(--shadow2);
}

.case-head {
  padding:30px 34px;
  background:linear-gradient(135deg,#172a4a,#204b78);
  color:#fff;
}

.case-meta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 16px;
}

.case-badge {
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:5px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.24);
  color:rgba(255,255,255,.94);
  font-size:.82rem;
  font-weight:800;
  line-height:1.35;
}

.case-head h3 {
  margin:0;
  font-size:clamp(1.35rem,2.3vw,1.85rem);
  line-height:1.45;
}

.case-head p {
  margin:12px 0 0;
  color:rgba(255,255,255,.86);
  font-size:1rem;
  line-height:1.75;
}

.case-body {
  padding:34px;
}

.case-columns {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.case-detail {
  padding:22px;
  border-radius:18px;
  background:#f7fafd;
  border:1px solid var(--border);
}

.case-detail h4 {
  margin:0 0 10px;
  color:var(--blue-dark);
  font-size:.96rem;
  line-height:1.45;
}

.case-detail p {
  margin:0;
  color:#344253;
  font-size:.96rem;
  line-height:1.72;
}

.case-point {
  margin-top:22px;
  padding:22px 24px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(31,111,178,.08),rgba(58,155,220,.1));
  border:1px solid rgba(31,111,178,.16);
}

.case-point h4 {
  margin:0 0 8px;
  color:var(--navy);
  font-size:1rem;
  line-height:1.5;
}

.case-point p {
  margin:0;
  color:#344253;
  font-size:.98rem;
  line-height:1.75;
}

.tag-list {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.tag {
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:4px 11px;
  border-radius:999px;
  background:#eef5fb;
  color:var(--blue-dark);
  font-size:.78rem;
  font-weight:800;
  line-height:1.35;
}

@media(max-width:1080px) {
  .case-index { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .case-columns { grid-template-columns:1fr; }
}

@media(max-width:680px) {
  .intro-box,
  .case-body,
  .case-head { padding:24px; }
  .case-index { grid-template-columns:1fr; }
  .index-card { min-height:auto; }
}

/* works v8: rebuilt from v5 base, camera copy refined */

/* works v9: 実績を5件に絞り、一覧カードの下段を中央寄せ */
@media (min-width:1081px) {
  .case-index .index-card:nth-child(4) {
    grid-column:1 / 2;
  }

  .case-index .index-card:nth-child(5) {
    grid-column:2 / 3;
  }
}
