/* Section 07: outcome, numbers, what I delivered, what I learned */
#outcomes .oc-stats { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
#outcomes .oc-stats li { padding: 20px; border-radius: var(--radius, 12px); background: var(--card-yellow); color: var(--text); }
#outcomes .oc-stats li:nth-child(2) { background: var(--card-lavender); }
#outcomes .oc-stats li:nth-child(3) { background: var(--card-mint); }
#outcomes .oc-stats li:nth-child(4) { background: var(--card-sky); }
#outcomes .oc-stats b { display: block; font: 500 clamp(30px, 4vw, 40px)/1 var(--font-display); font-variant-numeric: tabular-nums; }
#outcomes .oc-stats span { display: block; margin-top: 8px; font-size: 14px; color: var(--muted); }
#outcomes .oc-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 40px; margin-top: 48px; }
#outcomes h3 { margin: 0 0 14px; font-family: var(--font-display); font-weight: 500; }
#outcomes .oc-delivered ul { margin: 0; padding-left: 20px; }
#outcomes .oc-delivered li { margin: 0 0 10px; }
#outcomes .oc-lesson { padding: 18px 20px; border-left: 3px solid var(--card-yellow); background: var(--surface); border-radius: 0 var(--radius, 12px) var(--radius, 12px) 0; }
#outcomes .oc-lesson + .oc-lesson { margin-top: 14px; border-left-color: var(--card-lavender); }
#outcomes .oc-lesson b { display: block; font-family: var(--font-display); font-weight: 500; font-size: 17px; margin-bottom: 6px; }
#outcomes .oc-lesson p { margin: 0; color: var(--muted); }
#outcomes .oc-quote { margin: 40px 0 0; padding: 24px; border-radius: var(--radius, 12px); background: var(--card-yellow); font: 400 20px/1.5 var(--font-display); }
@media (max-width: 860px) {
  #outcomes .oc-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #outcomes .oc-cols { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
