body .wrapper .steps { background-color: var(--osa-mist); }
body .wrapper .steps .step-list { list-style: none; margin: 0; padding: 0; counter-reset: none; display: flex; flex-direction: column; gap: 20px; }
/* Karte mit Lime-Kante und weichem Schatten statt flacher weisser Flaeche */
body .wrapper .steps .step-item { display: flex; gap: 20px; align-items: flex-start; background-color: var(--osa-card); border-left: 4px solid var(--osa-lime); box-shadow: var(--osa-shadow-1); padding: 26px 22px; transition: box-shadow 0.25s ease, transform 0.25s ease; }
body .wrapper .steps .step-item:hover { box-shadow: var(--osa-shadow-2); transform: translateX(3px); }
body .wrapper .steps .step-number { font-size: 52px; font-weight: 700; line-height: 0.9; letter-spacing: -2px; color: var(--osa-ink); opacity: 0.22; flex-shrink: 0; min-width: 70px; }
body .wrapper .steps .step-content { flex: 1; }
body .wrapper .steps .step-title { margin: 4px 0 0; font-size: 21px; font-weight: 700; letter-spacing: -0.4px; color: var(--osa-ink); }
body .wrapper .steps .step-text { margin: 10px 0 0; font-size: 15px; line-height: 1.65; color: var(--osa-muted); }
body .wrapper .steps .step-text strong { font-weight: 700; color: var(--osa-ink); }
body .wrapper .steps .step-links { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
body .wrapper .steps .step-links li a { font-size: 15px; font-weight: 700; color: var(--osa-ink); text-decoration: none; border-bottom: 2px solid var(--osa-lime); padding-bottom: 2px; }
body .wrapper .steps .step-links li a:hover { color: var(--osa-muted); }

@media (min-width: 768px) {
  body .wrapper .steps .step-item { padding: 34px 32px; gap: 28px; }
  body .wrapper .steps .step-number { font-size: 76px; min-width: 100px; letter-spacing: -3px; }
  body .wrapper .steps .step-title { font-size: 25px; }
}
@media (min-width: 1024px) {
  body .wrapper .steps .step-number { font-size: 92px; min-width: 130px; letter-spacing: -4px; }
}
