@font-face {
  font-family: "Geist";
  src: url("console/fonts/geist-sans/Geist-Variable.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

@font-face {
  font-family: "Geist Mono";
  src: url("console/fonts/geist-mono/GeistMono-Variable.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

body.api-landing {
  --landing-ink: #151715;
  --landing-muted: #656965;
  --landing-line: #dedfdb;
  --landing-soft: #f3f4f1;
  --landing-accent: #116149;
  --landing-accent-soft: #eaf4ef;
  margin: 0;
  background: #fafbf9;
  color: var(--landing-ink);
  font-family: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

body.api-landing * {
  box-sizing: border-box;
}

body.api-landing .api-shell {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
}

body.api-landing .api-nav {
  position: sticky;
  z-index: 30;
  top: 0;
  height: auto;
  border-bottom: 1px solid rgba(222, 223, 219, 0.9);
  background: rgba(250, 251, 249, 0.92);
  backdrop-filter: blur(16px);
}

body.api-landing .api-nav-inner {
  min-height: 68px;
}

body.api-landing .api-brand {
  gap: 10px;
  color: var(--landing-ink);
  font-family: "Geist", sans-serif;
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -0.02em;
}

body.api-landing .api-brand img {
  width: 30px;
  height: 30px;
  border-radius: 8px;
}

body.api-landing .api-brand small {
  margin-left: 2px;
  color: #858985;
  font-family: "Geist Mono", monospace;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

body.api-landing .api-nav-links {
  gap: 28px;
}

body.api-landing .api-nav-links a {
  color: #555955;
  font-family: "Geist", sans-serif;
  font-size: 0.86rem;
  font-weight: 520;
  letter-spacing: 0;
  text-transform: none;
}

body.api-landing .api-nav-links a:hover {
  color: var(--landing-ink);
}

body.api-landing .api-button {
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid #cfd1cd;
  border-radius: 8px;
  background: #fff;
  color: var(--landing-ink);
  font-family: "Geist", sans-serif;
  font-size: 0.86rem;
  font-weight: 620;
  letter-spacing: -0.01em;
  box-shadow: none;
  text-transform: none;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}

body.api-landing .api-button:hover {
  transform: none;
  border-color: #aeb2ad;
  background: #f7f8f6;
  box-shadow: none;
}

body.api-landing .api-button-dark {
  border-color: var(--landing-ink);
  background: var(--landing-ink);
  color: #fff;
}

body.api-landing .api-button-dark:hover {
  border-color: #2d302d;
  background: #2d302d;
  color: #fff;
}

body.api-landing .api-button-small {
  min-height: 38px;
  padding-inline: 14px;
  font-size: 0.8rem;
}

body.api-landing .api-hero {
  overflow: hidden;
  padding: 92px 0 88px;
  border-bottom: 1px solid var(--landing-line);
  background: #fafbf9;
}

body.api-landing .api-hero::before,
body.api-landing .api-hero::after,
body.api-landing .api-console::before,
body.api-landing .api-console::after,
body.api-landing .api-capability::before,
body.api-landing .api-capability::after {
  display: none;
  content: none;
}

body.api-landing .api-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(480px, 1.08fr);
  align-items: center;
  gap: 76px;
}

body.api-landing .api-eyebrow,
body.api-landing .api-kicker {
  margin: 0 0 18px;
  color: var(--landing-accent);
  font-family: "Geist Mono", monospace;
  font-size: 0.69rem;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.api-landing .api-eyebrow::before,
body.api-landing .api-kicker::before {
  display: none;
}

body.api-landing .api-hero-copy h1,
body.api-landing .api-section-heading h2,
body.api-landing .api-flow-copy h2,
body.api-landing .api-final h2 {
  margin: 0;
  color: var(--landing-ink);
  font-family: "Geist", sans-serif;
  font-weight: 570;
  letter-spacing: -0.052em;
}

body.api-landing .api-hero-copy h1 {
  max-width: 650px;
  font-size: clamp(3.6rem, 5.6vw, 5.25rem);
  line-height: 0.98;
}

body.api-landing .api-hero-copy h1 em {
  display: block;
  color: var(--landing-ink);
  font-style: normal;
  font-weight: inherit;
}

body.api-landing .api-hero-copy > p:not(.api-eyebrow) {
  max-width: 590px;
  margin: 26px 0 0;
  color: var(--landing-muted);
  font-size: 1.06rem;
  line-height: 1.65;
}

body.api-landing .api-actions {
  gap: 10px;
  margin-top: 28px;
}

body.api-landing .api-proofline {
  gap: 0;
  margin-top: 24px;
  color: #767a76;
  font-family: "Geist Mono", monospace;
  font-size: 0.7rem;
}

body.api-landing .api-proofline span {
  display: inline-flex;
  align-items: center;
}

body.api-landing .api-proofline span::before {
  display: none;
  content: none;
}

body.api-landing .api-proofline span:not(:last-child)::after {
  width: 3px;
  height: 3px;
  margin: 0 12px;
  border-radius: 50%;
  background: #aeb1ae;
  content: "";
}

body.api-landing .api-console {
  overflow: hidden;
  border: 1px solid #292d2a;
  border-radius: 13px;
  background: #171a18;
  box-shadow: 0 18px 40px rgba(20, 24, 21, 0.12);
  transform: none;
}

body.api-landing .api-console-bar {
  min-height: 45px;
  padding-inline: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  background: #1d201e;
}

body.api-landing .api-console-dots i {
  width: 7px;
  height: 7px;
  background: #626864;
}

body.api-landing .api-console-status,
body.api-landing .api-console-label,
body.api-landing .api-console pre,
body.api-landing .api-endpoint-row code,
body.api-landing .api-flow-step code {
  font-family: "Geist Mono", monospace;
}

body.api-landing .api-console-panel {
  padding: 16px 18px 18px;
}

body.api-landing .api-console-label {
  margin-bottom: 11px;
  color: #888e89;
  font-size: 0.65rem;
  letter-spacing: 0.05em;
}

body.api-landing .api-console pre {
  color: #dfe5e1;
  font-size: 0.72rem;
  line-height: 1.68;
}

body.api-landing .api-code-key,
body.api-landing .api-code-string {
  color: #8dd5b7;
}

body.api-landing .api-code-number,
body.api-landing .api-console-status strong {
  color: #b4df7b;
}

body.api-landing .api-section {
  padding: 96px 0;
  background: #fafbf9;
}

body.api-landing .api-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  align-items: end;
  gap: 72px;
  margin-bottom: 42px;
}

body.api-landing .api-section-heading h2,
body.api-landing .api-flow-copy h2,
body.api-landing .api-final h2 {
  max-width: 720px;
  font-size: clamp(2.4rem, 4.1vw, 3.75rem);
  line-height: 1.04;
}

body.api-landing .api-section-heading > p,
body.api-landing .api-flow-copy > p:not(.api-kicker),
body.api-landing .api-final p {
  margin: 0;
  color: var(--landing-muted);
  font-size: 0.96rem;
  line-height: 1.65;
}

body.api-landing .api-capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

body.api-landing .api-capability {
  grid-column: auto;
  min-height: 242px;
  padding: 25px;
  border: 1px solid var(--landing-line);
  border-radius: 10px;
  background: #fff;
  color: var(--landing-ink);
  box-shadow: none;
}

body.api-landing .api-capability:nth-child(n) {
  grid-column: auto;
  background: #fff;
  color: var(--landing-ink);
}

body.api-landing .api-capability-index {
  padding: 0;
  border: 0;
  color: #797d79;
  font-family: "Geist Mono", monospace;
  font-size: 0.65rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.api-landing .api-capability-index b {
  color: #a5a9a5;
  font-size: 0.66rem;
  font-weight: 500;
}

body.api-landing .api-capability h3 {
  margin: 56px 0 10px;
  color: var(--landing-ink);
  font-family: "Geist", sans-serif;
  font-size: 1.3rem;
  font-weight: 610;
  letter-spacing: -0.025em;
}

body.api-landing .api-capability p {
  max-width: 34ch;
  margin: 0;
  color: var(--landing-muted);
  font-size: 0.88rem;
  line-height: 1.58;
}

body.api-landing .api-section-dark {
  border: 0;
  background: #171a18;
  color: #f4f6f4;
}

body.api-landing .api-flow {
  display: grid;
  grid-template-columns: minmax(280px, 0.7fr) minmax(520px, 1.3fr);
  align-items: start;
  gap: 92px;
}

body.api-landing .api-flow-copy {
  position: sticky;
  top: 110px;
}

body.api-landing .api-flow-copy h2 {
  color: #f4f6f4;
}

body.api-landing .api-flow-copy > p:not(.api-kicker) {
  margin-top: 22px;
  color: #a9afaa;
}

body.api-landing .api-flow-list {
  border-top: 1px solid #3b403c;
}

body.api-landing .api-flow-step {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 18px;
  padding: 24px 0;
  border-bottom: 1px solid #3b403c;
  background: transparent;
}

body.api-landing .api-flow-step > span {
  color: #737a75;
  font-family: "Geist Mono", monospace;
  font-size: 0.67rem;
}

body.api-landing .api-flow-step h3 {
  margin: -3px 0 5px;
  color: #f4f6f4;
  font-size: 1rem;
  font-weight: 580;
  letter-spacing: -0.015em;
}

body.api-landing .api-flow-step p {
  max-width: 58ch;
  margin: 0;
  color: #9ca39e;
  font-size: 0.82rem;
  line-height: 1.55;
}

body.api-landing .api-flow-step code {
  padding: 3px 7px;
  border: 1px solid #414742;
  border-radius: 4px;
  color: #9ad1b8;
  font-size: 0.62rem;
}

body.api-landing .api-endpoints {
  overflow: hidden;
  border: 1px solid var(--landing-line);
  border-radius: 10px;
  background: #fff;
}

body.api-landing .api-endpoint-row {
  display: grid;
  grid-template-columns: 58px minmax(240px, 0.76fr) minmax(260px, 1fr) 20px;
  align-items: center;
  gap: 18px;
  min-height: 65px;
  padding: 0 20px;
  border-bottom: 1px solid var(--landing-line);
  background: #fff;
}

body.api-landing .api-endpoint-row:last-child {
  border-bottom: 0;
}

body.api-landing .api-endpoint-row:hover {
  background: #f7f8f6;
}

body.api-landing .api-method {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-family: "Geist Mono", monospace;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

body.api-landing .api-method.get {
  color: #0c7550;
}

body.api-landing .api-method.post {
  color: #6554a6;
}

body.api-landing .api-endpoint-row code {
  color: #232623;
  font-size: 0.78rem;
  font-weight: 570;
}

body.api-landing .api-endpoint-row p {
  margin: 0;
  color: var(--landing-muted);
  font-size: 0.82rem;
}

body.api-landing .api-endpoint-row b {
  color: #a0a4a0;
  font-weight: 400;
}

body.api-landing .api-pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

body.api-landing .api-price,
body.api-landing .api-price.api-price-featured {
  display: flex;
  flex-direction: column;
  min-height: 374px;
  padding: 24px;
  border: 1px solid var(--landing-line);
  border-radius: 10px;
  background: #fff;
  color: var(--landing-ink);
  box-shadow: none;
  transform: none;
}

body.api-landing .api-price.api-price-featured {
  border-color: #78a894;
  background: var(--landing-accent-soft);
}

body.api-landing .api-price-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  color: #656a65;
  font-family: "Geist Mono", monospace;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.api-landing .api-price-label span {
  padding: 3px 7px;
  border-radius: 999px;
  background: #d7eae1;
  color: #155942;
  font-size: 0.58rem;
}

body.api-landing .api-price h3,
body.api-landing .api-price.api-price-featured h3 {
  margin: 32px 0 3px;
  color: var(--landing-ink);
  font-family: "Geist", sans-serif;
  font-size: 2.15rem;
  font-weight: 590;
  letter-spacing: -0.05em;
}

body.api-landing .api-price h3 small {
  color: #777b77;
  font-size: 0.75rem;
  font-weight: 450;
  letter-spacing: 0;
}

body.api-landing .api-price > p:not(.api-price-label) {
  margin: 0;
  color: var(--landing-muted);
  font-size: 0.82rem;
}

body.api-landing .api-price ul {
  flex: 1;
  margin: 26px 0;
  padding: 20px 0 0;
  border-top: 1px solid var(--landing-line);
  color: #525652;
  font-size: 0.82rem;
}

body.api-landing .api-price li {
  margin: 0 0 10px;
}

body.api-landing .api-price li::before {
  color: var(--landing-accent);
}

body.api-landing .api-price .api-button {
  width: 100%;
  justify-content: center;
}

body.api-landing .api-button-citrus {
  border-color: var(--landing-ink);
  background: var(--landing-ink);
  color: #fff;
}

body.api-landing .api-final {
  padding: 72px 0;
  border: 0;
  background: #0f4e3b;
  color: #fff;
}

body.api-landing .api-final::before,
body.api-landing .api-final::after {
  display: none;
}

body.api-landing .api-final-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 54px;
}

body.api-landing .api-final h2 {
  color: #fff;
  font-size: clamp(2.2rem, 3.7vw, 3.4rem);
}

body.api-landing .api-final p {
  margin-top: 12px;
  color: #c1d5cc;
}

body.api-landing .api-final .api-actions {
  flex: 0 0 auto;
  margin: 0;
}

body.api-landing .api-final .api-button-citrus {
  border-color: #fff;
  background: #fff;
  color: #133d31;
}

body.api-landing .api-footer {
  padding: 30px 0;
  border: 0;
  background: #111412;
}

body.api-landing .api-footer-inner {
  gap: 30px;
}

body.api-landing .api-footer-links {
  gap: 24px;
}

body.api-landing .api-footer-links a,
body.api-landing .api-footer small {
  color: #9ca19d;
  font-family: "Geist", sans-serif;
  font-size: 0.75rem;
}

@media (max-width: 980px) {
  body.api-landing .api-nav-links {
    display: none;
  }

  body.api-landing .api-hero {
    padding: 72px 0;
  }

  body.api-landing .api-hero-grid,
  body.api-landing .api-flow {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  body.api-landing .api-hero-copy h1 {
    max-width: 720px;
  }

  body.api-landing .api-flow-copy {
    position: static;
  }

  body.api-landing .api-capability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.api-landing .api-pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  body.api-landing .api-shell {
    width: min(100% - 32px, 1180px);
  }

  body.api-landing .api-brand small {
    display: none;
  }

  body.api-landing .api-nav .api-button-small {
    min-height: 36px;
    padding-inline: 11px;
  }

  body.api-landing .api-hero {
    padding: 56px 0 62px;
  }

  body.api-landing .api-hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 42px;
  }

  body.api-landing .api-hero-copy h1 {
    font-size: clamp(3rem, 14vw, 4.2rem);
  }

  body.api-landing .api-hero-copy h1 em {
    display: inline;
  }

  body.api-landing .api-console pre {
    overflow-x: auto;
    font-size: 0.64rem;
  }

  body.api-landing .api-section {
    padding: 72px 0;
  }

  body.api-landing .api-section-heading {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 32px;
  }

  body.api-landing .api-section-heading h2,
  body.api-landing .api-flow-copy h2 {
    font-size: 2.55rem;
  }

  body.api-landing .api-capability-grid,
  body.api-landing .api-pricing-grid {
    grid-template-columns: 1fr;
  }

  body.api-landing .api-capability {
    min-height: 216px;
  }

  body.api-landing .api-capability h3 {
    margin-top: 38px;
  }

  body.api-landing .api-flow {
    grid-template-columns: minmax(0, 1fr);
    gap: 42px;
  }

  body.api-landing .api-flow-step {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  body.api-landing .api-flow-step code {
    display: none;
  }

  body.api-landing .api-endpoint-row {
    grid-template-columns: 48px minmax(0, 1fr) 16px;
    gap: 10px;
    min-height: 68px;
    padding-inline: 14px;
  }

  body.api-landing .api-endpoint-row p {
    display: none;
  }

  body.api-landing .api-endpoint-row code {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.api-landing .api-price,
  body.api-landing .api-price.api-price-featured {
    min-height: 350px;
  }

  body.api-landing .api-final-inner {
    display: block;
  }

  body.api-landing .api-final .api-actions {
    margin-top: 28px;
  }

  body.api-landing .api-footer-inner {
    align-items: flex-start;
  }

  body.api-landing .api-footer-links {
    gap: 14px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.api-landing *,
  body.api-landing *::before,
  body.api-landing *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}
