/* Shared by the API and CLI landing pages; the MCP chassis is in styles.css. */
.developer-page .mcp-hero { margin-top: 0; }
.developer-page main { padding-top: 80px; }
.developer-page .mcp-hero-inner { gap: 3rem; }
.developer-example { min-width: 0; }
.developer-page .gg-prompt { margin: 0; width: 100%; max-width: none; }
.developer-page .gg-prompt-body { white-space: pre-wrap; overflow-wrap: anywhere; text-align: left; }
.developer-page .gg-prompt-body, .developer-page .gg-prompt-body code { direction: ltr; unicode-bidi: isolate; }
.developer-endpoint { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; color: var(--col-darkfore2); overflow-wrap: anywhere; padding: 1rem 0; text-align: left; }
.developer-endpoint span { color: var(--col-lightaccent2); margin-right: .5rem; }
.developer-grid, .developer-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.developer-workflow { background: rgba(126, 185, 232, .035); border-block: 1px solid rgba(126, 185, 232, .12); }
.developer-steps { list-style: none; counter-reset: steps; padding: 2rem 0 1rem; margin: 0; gap: 2.5rem; }
.developer-steps li { counter-increment: steps; }
.developer-steps li::before { content: '0' counter(steps); color: var(--col-lightaccent2); font-family: ui-monospace, monospace; }
.developer-steps h3 { color: var(--col-darkfore1); font-family: var(--sofiasans); font-size: 1.35rem; margin: .8rem 0; }
.developer-page main p { color: var(--col-darkfore2); line-height: 1.75; }
.developer-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.developer-bottom h2 { text-align: start; font-size: 1.75rem; margin-bottom: 1rem; }
.developer-bottom p { margin-bottom: 1.25rem; }
.developer-page :is(a, button):focus-visible { outline: 2px solid var(--col-lightaccent2); outline-offset: 5px; }
@media (max-width: 901px) {
    .developer-grid, .developer-steps { grid-template-columns: 1fr; }
    .developer-steps { gap: 2rem; }
    .developer-bottom { grid-template-columns: 1fr; gap: 3rem; }
}
