.api-example{padding:80px 0;background-color:var(--light-color)}.api-demo{display:grid;grid-template-columns:1fr 2fr;gap:4rem;align-items:start}.api-steps{display:flex;flex-direction:column;gap:2rem}.api-step{gap:1rem}.api-step,.step-number{display:flex;align-items:center}.step-number{width:40px;height:40px;background-color:var(--primary-color);color:white;border-radius:50%;justify-content:center;font-weight:600;flex-shrink:0}.step-content h4{margin-bottom:.5rem;color:var(--primary-color)}.code-example{background-color:#1a1a1a;border-radius:8px;padding:2rem;overflow-x:auto}.code-example h4{color:white;margin-bottom:1rem}.code-example pre{margin:0;overflow-x:auto}.code-example code{color:#f8f8f2;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875rem;line-height:1.5}