.api-page a:not(.nav-page-button) { color:#2560cc; text-underline-offset:.2em; }
.api-page a:focus-visible { outline:3px solid #2560cc; outline-offset:5px; }
.api-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:1rem; margin-top:1.5rem; }
.api-secondary { display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 1.25rem; border:1px solid #c0d6ff; border-radius:2rem; background:#fff; font-weight:600; text-decoration:none; }
.api-page figure { margin:0; }
.api-page img.Screenshot { width:100%; height:auto; box-sizing:border-box; }
.api-page figcaption { color:#617785; font-size:.9rem; line-height:1.6; margin-top:1rem; text-align:center; }
.api-section { padding:4rem 2rem; }
.api-tinted { background:#f4fbfe; }
.api-intro { max-width:850px; margin:0 auto 2rem; }
.api-page h2:not(:where(.site-page-title)) { color:#24485a; font-size:2rem; padding:0; }
.api-page h3 { color:#24485a; font-size:1.3rem; }
.api-section p { font-size:1.05rem; line-height:1.75; }
.api-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; max-width:1200px; margin:auto; }
.api-grid article { padding:1.75rem; background:#fff; border:1px solid #deebf2; border-radius:1.2rem; }
.api-grid h3 { margin-top:0; }
.api-two-column { grid-template-columns:repeat(2,minmax(0,1fr)); }
.api-two-column h2:not(:where(.site-page-title)) { font-size:1.55rem; }
.api-flow { display:flex; align-items:center; justify-content:center; gap:1.5rem; max-width:850px; margin:2rem auto; }
.api-flow > div { flex:1; padding:1.6rem; border:1px solid #c0d6ff; background:#f4fbfe; border-radius:1.2rem; }
.api-flow > div > span { color:#2560cc; font-size:.85rem; font-weight:700; }
.api-flow-arrow { font-size:2rem; color:#2560cc; }
.api-followup { margin-bottom:0; }
@media(max-width:760px) { .api-section { padding:2.5rem 1.25rem; } .api-grid { grid-template-columns:1fr; } .api-page h2:not(:where(.site-page-title)) { font-size:1.6rem; } .api-flow { flex-direction:column; gap:.75rem; align-items:stretch; } .api-flow-arrow { text-align:center; transform:rotate(90deg); } .api-secondary { text-align:center; justify-content:center; } }
