/* Case story: four photos in a row, light background */
.story__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 2.5vw, 36px); }
.sstep { min-width: 0; }
.sstep__photo img { aspect-ratio: 4 / 5; }
.sstep__num { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-top: 20px; border: 1px solid var(--ink); border-radius: 50%; font: 600 var(--fs-sm)/1 var(--f-head); color: var(--ink); }
.sstep__title { margin-top: 12px; font-size: var(--fs-lg); }
.sstep__text { margin-top: 8px; font-size: var(--fs-sm); color: var(--muted); }

.story__end { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; margin-top: clamp(48px, 6vw, 88px); padding-top: 32px; border-top: 1px solid var(--line-strong); }
.story__num { font-size: var(--fs-lg); color: var(--muted); }
.story__num b { font: 600 var(--fs-3xl)/1 var(--f-head); color: var(--accent); margin-right: 10px; letter-spacing: -0.03em; }
.story__takeaway { display: flex; flex-direction: column; gap: 10px; max-width: 46ch; }

@media (max-width: 1000px) { .story__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 24px; } }
@media (max-width: 560px) {
  .story__steps { grid-template-columns: 1fr; }
  .sstep__photo img { aspect-ratio: 4 / 3; }
}