/* API and alternative pages extend the accepted homepage components. */
.v-api{background:radial-gradient(ellipse 1000px 600px at 80% 10%,#284d712b,transparent),var(--bg)}
.v-api .landing-header{background:#0c132080}
.v-api .nav{padding-block:22px}
.v-api .land{max-width:1440px;margin:auto;padding:0 var(--gutter)}
.v-api .skip-link{position:fixed;z-index:50;top:12px;left:22px;transform:translateY(-160%);padding:12px 18px;border-radius:12px;background:var(--accent);color:var(--on-action)}
.v-api .skip-link:focus{transform:none}
.v-api .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.v-api .lhero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:64px;padding:65px 0 72px}
.v-api .hero-copy{min-width:0}
.v-api .crumb{margin-bottom:28px;color:var(--muted);font-size:13px;line-height:1.7;overflow-wrap:anywhere}
.v-api .crumb a{color:var(--accent);text-underline-offset:4px}
.v-api .crumb a:hover{text-decoration:underline}
.v-api h1{max-width:620px;font-size:46px;line-height:1.2;text-wrap:pretty}
.v-api h1 span{color:var(--accent)}
.v-api .lead{max-width:65ch;margin-top:24px;color:var(--muted);font-size:16px;line-height:1.75}
.v-api p{overflow-wrap:anywhere}
.v-api p b{color:var(--ink);font-weight:600}
.v-api .lbtns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.v-api .lbtns a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border:1px solid transparent;border-radius:16px;font-size:15px;font-weight:500;line-height:1.5}
.v-api .lbtns .primary{background:var(--action);color:var(--on-action)}
.v-api .lbtns .primary:hover{background:var(--action-hover)}
.v-api .lbtns .ghost{border-color:#536c8a;background:#14233966;color:var(--ink)}
.v-api .lbtns .ghost:hover{border-color:var(--accent);background:#1b2e49}
.v-api .landing-code{grid-column:auto}
.v-api .code-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:4px 14px 4px 28px;border-radius:23px 23px 0 0;background:#13243a;color:#afc5df;font-size:12px;font-weight:500;letter-spacing:.06em}
.v-api .code-copy{margin:0;flex:none;color:#9eb3ce}
.v-api .code-copy[hidden]{display:none}
.v-api .lcode{margin:0;padding:28px;border-radius:0 0 23px 23px;background:linear-gradient(115deg,#122740,#0b1728 65%);color:#e3edfa;font:400 16px/1.85 var(--mono);white-space:break-spaces;overflow-wrap:anywhere;tab-size:2}
.v-api .lcode code{font:inherit;color:inherit}
.v-api .overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;padding:46px 0 0;border-top:1px solid var(--line)}
.v-api .overview p,.v-api .comparison-note{max-width:75ch;color:var(--muted);font-size:16px;line-height:1.75}
.v-api .comparison-note{margin-top:24px}
.v-api h2{font-size:30px;line-height:1.35;text-wrap:pretty}
.v-api .comparison,.v-api .landing-faq,.v-api .landing-related{margin-top:65px}
.v-api .comparison h2,.v-api .landing-related h2{margin-bottom:28px}
.v-api .lcmp{min-width:640px;font-size:15px;line-height:1.6}
.v-api .lcmp th,.v-api .lcmp td{padding:20px 24px;vertical-align:middle}
.v-api .lcmp thead th{height:auto;padding-block:22px;font-size:15px;font-weight:500}
.v-api .lcmp tbody th{font-weight:400}
.v-api .lcmp tbody td{font-size:15px;font-weight:400}
.v-api .lcmp th:first-child{width:28%}
.v-api .landing-faq{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,1fr);gap:72px}
.v-api .related{gap:0 38px}
.v-api .kw{min-width:0;padding-block:24px}
.v-api .kw b{overflow-wrap:anywhere}
.v-api .kw::after{top:23px}
.v-api .lfoot{margin-top:48px;padding:28px 0 48px;border-top:1px solid var(--line);color:#9eadc5;font-size:13px;line-height:1.8;overflow-wrap:anywhere}
.v-api .lfoot a{color:var(--accent);text-underline-offset:4px}
.v-api .lfoot a:hover{text-decoration:underline}
@media(max-width:1050px){
  .v-api .lhero{gap:38px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-api .overview{gap:38px}
  .v-api .related{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px}
  .v-api .lcmp{min-width:640px}
  .v-api .lcmp th:first-child{background:#172438}
}
@media(max-width:900px){
  .v-api .lhero{grid-template-columns:minmax(0,1fr);gap:38px;padding:38px 0 48px}
  .v-api .lead{max-width:75ch}
  .v-api .overview{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:38px}
  .v-api .landing-faq{grid-template-columns:minmax(0,1fr);gap:24px}
}
@media(max-width:700px){
  .v-api{--gutter:22px}
  .v-api .nav{padding-block:20px}
  .v-api .crumb{margin-bottom:22px}
  .v-api h1{font-size:34px}
  .v-api h2{font-size:28px}
  .v-api .code-bar{padding-left:22px}
  .v-api .lcode{padding:22px;font-size:14px}
  .v-api .comparison,.v-api .landing-faq,.v-api .landing-related{margin-top:48px}
  .v-api .lcmp th,.v-api .lcmp td{padding:18px 20px;font-size:14px}
  .v-api .lcmp thead th,.v-api .lcmp tbody td{font-size:14px}
  .v-api .lcmp tr>:first-child{position:static;box-shadow:none}
  .v-api .related{grid-template-columns:minmax(0,1fr)}
  .v-api .lfoot{margin-top:38px;padding-bottom:32px}
}
