
body.s-business{
  background:
    radial-gradient(900px 550px at 90% 0%,hsl(var(--h) 85% 90% / .7),transparent 65%),
    radial-gradient(700px 500px at 0% 35%,hsl(calc(var(--h) + 35) 85% 92% / .6),transparent 65%),
    var(--cream);
}
.steps{padding:4.5rem 0}
.stick{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:2.8rem;
  align-items:start;
}
.sticky{position:sticky;top:100px}
.steplist{display:grid;gap:18px}
.step{
  background:var(--surface);
  border:2px solid var(--border);
  border-radius:24px;
  padding:1.5rem 1.6rem;
  box-shadow:var(--shadow-sm);
  cursor:pointer;
  transition:all .25s ease;
}
.step:hover{border-color:hsl(var(--h) 60% 70%);transform:translateY(-2px)}
.step.on{
  border-color:var(--c);
  box-shadow:0 20px 44px -12px hsl(var(--h) 70% 40% / .18);
  background:linear-gradient(145deg,#fff,var(--cl));
}
.step-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.9rem}
.step .no{
  font-weight:900;
  font-size:.82rem;
  letter-spacing:.12em;
  color:#fff;
  background:var(--c);
  padding:.3em .85em;
  border-radius:999px;
}
.step-sc-tag{font-size:.76rem;font-weight:900;color:var(--c);opacity:.8}
.pain-box{
  display:flex;
  align-items:baseline;
  gap:10px;
  padding-bottom:.75rem;
  margin-bottom:.75rem;
  border-bottom:1px dashed var(--border);
}
.tag-bad{
  font-size:.72rem;
  font-weight:900;
  background:#fee2e2;
  color:#b91c1c;
  padding:.2em .65em;
  border-radius:6px;
  flex-shrink:0;
}
.step .pain{font-weight:700;font-size:1rem;color:var(--brown-soft)}
.fix-box{display:flex;align-items:baseline;gap:10px}
.tag-good{
  font-size:.72rem;
  font-weight:900;
  background:var(--orange);
  color:#fff;
  padding:.2em .65em;
  border-radius:6px;
  flex-shrink:0;
}
.step .fix{font-weight:900;font-size:1.14rem;line-height:1.5;color:var(--brown)}
@media(max-width:860px){
  .stick{grid-template-columns:1fr;gap:1.8rem}
  .sticky{position:relative;top:0}
}
