/*fern-site-stylesheet*/@font-face {
    font-family: 'Inter';
    src: url('/_fern-files/taurushq.docs.buildwithfern.com/8909904ab6c872eb994093482a88a28eca2cd95912d7b6fecd72103b0dc07edc/assets/fonts/inter-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('/_fern-files/taurushq.docs.buildwithfern.com/f9a06e79cd3a2a20951c0f0e28f66dd0e6d3fda73911d640a2125c8fcb78f21a/assets/fonts/inter-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'InterHeading';
    src: url('/_fern-files/taurushq.docs.buildwithfern.com/6f56409fd3d64bb85f7d070bce20749db2d66b6d63cec586cc22d1c761be2491/assets/fonts/inter-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'JetBrainsMono';
    src: url('/_fern-files/taurushq.docs.buildwithfern.com/14425ba9c695763c1547f48a206b7aa60350a33ae23de09f0407877f3fcd89eb/assets/fonts/jetbrains-mono-400.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
  --header-height: 64px;
  --header-height-real: 64px;
  --mobile-header-height-real: 64px;
  --content-width: 840px;
  --sidebar-width: 288px;
  --page-width: 1448px;
  --logo-height: 22px;
  --font-body: 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-heading: 'InterHeading', 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-code: 'JetBrainsMono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}

:root {
  --typography-body-font-family: var(--font-body);
  --typography-heading-font-family: var(--font-heading);
  --typography-code-font-family: var(--font-code);
}


:root {
  --accent-1: #fffbff;
  --accent-2: #fff5ff;
  --accent-3: #ffe4ff;
  --accent-4: #ffd3ff;
  --accent-5: #ffc1ff;
  --accent-6: #ffadff;
  --accent-7: #ff90ff;
  --accent-8: #f862fd;
  --accent-9: #fa64ff;
  --accent-10: #ee57f3;
  --accent-11: #ac00b3;
  --accent-12: #610066;

  --accent-a1: #ff00ff04;
  --accent-a2: #ff00ff0a;
  --accent-a3: #ff00ff1b;
  --accent-a4: #ff00ff2c;
  --accent-a5: #ff00ff3e;
  --accent-a6: #ff00ff52;
  --accent-a7: #ff00ff6f;
  --accent-a8: #f400fc9d;
  --accent-a9: #f700ff9b;
  --accent-a10: #e500eda8;
  --accent-a11: #ac00b3;
  --accent-a12: #610066;

  --accent-contrast: #fff;
  --accent-surface: #fff3ffcc;
  --accent-indicator: #fa64ff;
  --accent-track: #fa64ff;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    :root {
      --accent-1: oklch(99.3% 0.0099 326.4);
      --accent-2: oklch(98.3% 0.0192 326.4);
      --accent-3: oklch(95.7% 0.0574 326.4);
      --accent-4: oklch(92.9% 0.0913 326.4);
      --accent-5: oklch(89.8% 0.1202 326.4);
      --accent-6: oklch(86% 0.1514 326.4);
      --accent-7: oklch(80.9% 0.1915 326.4);
      --accent-8: oklch(74.2% 0.2512 326.4);
      --accent-9: oklch(74.8% 0.2512 326.4);
      --accent-10: oklch(71.3% 0.2512 326.4);
      --accent-11: oklch(52.1% 0.2512 326.4);
      --accent-12: oklch(33.8% 0.2512 326.4);

      --accent-a1: color(display-p3 0.7569 0.0235 1 / 0.016);
      --accent-a2: color(display-p3 0.8078 0.0235 0.9059 / 0.04);
      --accent-a3: color(display-p3 0.8078 0.0039 0.9255 / 0.102);
      --accent-a4: color(display-p3 0.8353 0.0039 0.9294 / 0.165);
      --accent-a5: color(display-p3 0.8353 0.0039 0.9373 / 0.236);
      --accent-a6: color(display-p3 0.8471 0.0039 0.9373 / 0.306);
      --accent-a7: color(display-p3 0.8588 0.0039 0.9451 / 0.412);
      --accent-a8: color(display-p3 0.8314 0 0.9412 / 0.577);
      --accent-a9: color(display-p3 0.8431 0 0.9529 / 0.569);
      --accent-a10: color(display-p3 0.7843 0 0.8784 / 0.62);
      --accent-a11: color(display-p3 0.5608 0 0.6353 / 0.879);
      --accent-a12: color(display-p3 0.3098 0 0.349 / 0.95);

      --accent-contrast: #fff;
      --accent-surface: color(display-p3 1 0.9569 1 / 0.8);
      --accent-indicator: oklch(74.8% 0.2512 326.4);
      --accent-track: oklch(74.8% 0.2512 326.4);
    }
  }
}


:root {
  --grayscale-1: #fdfcfd;
  --grayscale-2: #faf9fb;
  --grayscale-3: #f2eff3;
  --grayscale-4: #eae7ec;
  --grayscale-5: #e3dfe6;
  --grayscale-6: #dbd8e0;
  --grayscale-7: #d0cdd7;
  --grayscale-8: #bcbac7;
  --grayscale-9: #8e8c99;
  --grayscale-10: #84828e;
  --grayscale-11: #65636d;
  --grayscale-12: #211f26;

  --grayscale-a1: #55005503;
  --grayscale-a2: #2b005506;
  --grayscale-a3: #30004010;
  --grayscale-a4: #20003618;
  --grayscale-a5: #20003820;
  --grayscale-a6: #14003527;
  --grayscale-a7: #10003332;
  --grayscale-a8: #08003145;
  --grayscale-a9: #05001d73;
  --grayscale-a10: #0500197d;
  --grayscale-a11: #0400119c;
  --grayscale-a12: #020008e0;

  --grayscale-contrast: #000;
  --grayscale-surface: #ffffffcc;
  --grayscale-indicator: #8e8c99;
  --grayscale-track: #8e8c99;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    :root {
      --grayscale-1: color(display-p3 0.991 0.988 0.992);
      --grayscale-2: color(display-p3 0.98 0.976 0.984);
      --grayscale-3: color(display-p3 0.946 0.938 0.952);
      --grayscale-4: color(display-p3 0.915 0.906 0.925);
      --grayscale-5: color(display-p3 0.886 0.876 0.901);
      --grayscale-6: color(display-p3 0.856 0.846 0.875);
      --grayscale-7: color(display-p3 0.814 0.804 0.84);
      --grayscale-8: color(display-p3 0.735 0.728 0.777);
      --grayscale-9: color(display-p3 0.555 0.549 0.596);
      --grayscale-10: color(display-p3 0.514 0.508 0.552);
      --grayscale-11: color(display-p3 0.395 0.388 0.424);
      --grayscale-12: color(display-p3 0.128 0.122 0.147);

      --grayscale-a1: #55005503;
      --grayscale-a2: #2b005506;
      --grayscale-a3: #30004010;
      --grayscale-a4: #20003618;
      --grayscale-a5: #20003820;
      --grayscale-a6: #14003527;
      --grayscale-a7: #10003332;
      --grayscale-a8: #08003145;
      --grayscale-a9: #05001d73;
      --grayscale-a10: #0500197d;
      --grayscale-a11: #0400119c;
      --grayscale-a12: #020008e0;

      --grayscale-contrast: #000;
      --grayscale-surface: color(display-p3 1 1 1 / 80%);
      --grayscale-indicator: color(display-p3 0.555 0.549 0.596);
      --grayscale-track: color(display-p3 0.555 0.549 0.596);
    }
  }
}


.dark {
  --accent-1: #000;
  --accent-2: #121211;
  --accent-3: #1f1f1d;
  --accent-4: #282826;
  --accent-5: #30302e;
  --accent-6: #3a3a37;
  --accent-7: #484845;
  --accent-8: #60605e;
  --accent-9: #fff;
  --accent-10: #f6f6f4;
  --accent-11: #b3b3b0;
  --accent-12: #eeeeec;

  --accent-a1: #00000000;
  --accent-a2: #fffff112;
  --accent-a3: #ffffef1f;
  --accent-a4: #fffff328;
  --accent-a5: #fffff530;
  --accent-a6: #fffff23a;
  --accent-a7: #fffff548;
  --accent-a8: #fffffa60;
  --accent-a9: #ffffff;
  --accent-a10: #fffffdf6;
  --accent-a11: #fffffbb3;
  --accent-a12: #fffffdee;

  --accent-contrast: #311921;
  --accent-surface: #24242280;
  --accent-indicator: #fff;
  --accent-track: #fff;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark {
      --accent-1: oklch(0% 0.0023 106.5);
      --accent-2: oklch(18.3% 0.0022 106.5);
      --accent-3: oklch(23.9% 0.0032 106.5);
      --accent-4: oklch(27.5% 0.0036 106.5);
      --accent-5: oklch(30.8% 0.004 106.5);
      --accent-6: oklch(34.7% 0.004 106.5);
      --accent-7: oklch(40% 0.004 106.5);
      --accent-8: oklch(49% 0.004 106.5);
      --accent-9: oklch(100% 0 none);
      --accent-10: oklch(97.3% 0.0027 106.5);
      --accent-11: oklch(76.7% 0.004 106.5);
      --accent-12: oklch(94.8% 0.0027 106.5);

      --accent-a1: color(display-p3 0 0 0 / 0);
      --accent-a2: color(display-p3 0.9961 0.9961 0.9412 / 0.071);
      --accent-a3: color(display-p3 1 1 0.9333 / 0.122);
      --accent-a4: color(display-p3 1 1 0.9529 / 0.157);
      --accent-a5: color(display-p3 0.9961 0.9961 0.9569 / 0.189);
      --accent-a6: color(display-p3 1 1 0.949 / 0.228);
      --accent-a7: color(display-p3 1 1 0.9569 / 0.283);
      --accent-a8: color(display-p3 1 1 0.9804 / 0.377);
      --accent-a9: color(display-p3 1 1 1);
      --accent-a10: color(display-p3 1 1 0.9922 / 0.965);
      --accent-a11: color(display-p3 1 1 0.9843 / 0.702);
      --accent-a12: color(display-p3 1 1 0.9922 / 0.934);

      --accent-contrast: #311921;
      --accent-surface: color(display-p3 0.1412 0.1412 0.1333 / 0.5);
      --accent-indicator: oklch(100% 0 none);
      --accent-track: oklch(100% 0 none);
    }
  }
}


.dark {
  --grayscale-1: #111110;
  --grayscale-2: #191918;
  --grayscale-3: #222221;
  --grayscale-4: #2a2a28;
  --grayscale-5: #31312e;
  --grayscale-6: #3b3a37;
  --grayscale-7: #494844;
  --grayscale-8: #62605b;
  --grayscale-9: #6f6d66;
  --grayscale-10: #7c7b74;
  --grayscale-11: #b5b3ad;
  --grayscale-12: #eeeeec;

  --grayscale-a1: #00000000;
  --grayscale-a2: #f4f4f309;
  --grayscale-a3: #f6f6f513;
  --grayscale-a4: #fefef31b;
  --grayscale-a5: #fbfbeb23;
  --grayscale-a6: #fffaed2d;
  --grayscale-a7: #fffbed3c;
  --grayscale-a8: #fff9eb57;
  --grayscale-a9: #fffae965;
  --grayscale-a10: #fffdee73;
  --grayscale-a11: #fffcf4b0;
  --grayscale-a12: #fffffded;

  --grayscale-contrast: #fff;
  --grayscale-surface: rgba(0, 0, 0, 0.05);
  --grayscale-indicator: #6f6d66;
  --grayscale-track: #6f6d66;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark {
      --grayscale-1: color(display-p3 0.067 0.067 0.063);
      --grayscale-2: color(display-p3 0.098 0.098 0.094);
      --grayscale-3: color(display-p3 0.135 0.135 0.129);
      --grayscale-4: color(display-p3 0.164 0.163 0.156);
      --grayscale-5: color(display-p3 0.193 0.192 0.183);
      --grayscale-6: color(display-p3 0.23 0.229 0.217);
      --grayscale-7: color(display-p3 0.285 0.282 0.267);
      --grayscale-8: color(display-p3 0.384 0.378 0.357);
      --grayscale-9: color(display-p3 0.434 0.428 0.403);
      --grayscale-10: color(display-p3 0.487 0.481 0.456);
      --grayscale-11: color(display-p3 0.707 0.703 0.68);
      --grayscale-12: color(display-p3 0.933 0.933 0.926);

      --grayscale-a1: #00000000;
      --grayscale-a2: #f4f4f309;
      --grayscale-a3: #f6f6f513;
      --grayscale-a4: #fefef31b;
      --grayscale-a5: #fbfbeb23;
      --grayscale-a6: #fffaed2d;
      --grayscale-a7: #fffbed3c;
      --grayscale-a8: #fff9eb57;
      --grayscale-a9: #fffae965;
      --grayscale-a10: #fffdee73;
      --grayscale-a11: #fffcf4b0;
      --grayscale-a12: #fffffded;

      --grayscale-contrast: #fff;
      --grayscale-surface: color(display-p3 0 0 0 / 5%);
      --grayscale-indicator: color(display-p3 0.434 0.428 0.403);
      --grayscale-track: color(display-p3 0.434 0.428 0.403);
    }
  }
}

:root {
  color-scheme: light;
  --accent: rgba(250, 100, 255, 1);
  --background: rgba(255, 255, 255, 1);
  --border: rgba(229, 231, 235, 1);
  --sidebar-background: rgba(249, 250, 251, 1);
  --header-background: rgba(255, 255, 255, 1);
  --card-background: initial;
  --theme-color: #fff;
}

.dark {
  color-scheme: light;
  --background: #000000;
  --accent: #ffffff;
}

/* Landing page styles, converted from taurus-docs-home-v3_15.html (centered hero with a
 * search box + Ask AI button, Products and Resources as two equal card columns).
 *
 * Every selector is scoped under `.thq-home`, which the landing MDX wraps everything in.
 * The source stylesheet targeted `*`, `html`, `body` and `a` bare; loaded globally by
 * Fern those would restyle every page of the docs site, not just this one.
 *
 * Dropped rather than scoped:
 *   *, html, body, ::selection      page-level resets Fern already owns
 *   header and its controls         the source's own chrome (logo, product toggle,
 *   (.nav, .seg, .dd, .sbox-nav,    version menu, nav search, Ask AI, language, log in).
 *   .btn-ask-nav, .btn-login, ...)  Fern supplies the real header
 *   rules superseded within the     earlier design iterations kept in the source
 *   source (.hero-grid, .askbox,    (V1-V3) that its final markup no longer uses
 *   .term, .prow, .bigsearch, ...)
 *
 * `:root` custom properties are re-hosted on `.thq-home`: they are only referenced by
 * these rules, so there is no reason to publish them site-wide where they could collide
 * with Fern's own variables.
 *
 * Generated from the HTML -- if the design changes, re-convert rather than editing both.
 */

.thq-home { --ink: #232027; --ink-2: #4f4d55; --abbey: #55535a; --grey: #787679; --platinium: #e2e2e3; --line: #e8e7e9; --ghost: #efeef1; --soft: #f7f6f8; --white: #ffffff; --pink: #fa64ff; --pink-dark: #c13bc6; --pink-tint: #fdf1fe; --pink-soft: #f9ddfb; --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; --mono: ui-monospace, 'SF Mono', 'Cascadia Code', 'JetBrains Mono', Menlo, Consolas, monospace; --shadow-soft: 0 24px 60px -28px rgba(35, 32, 39, .16); --shadow-hover: 0 30px 70px -26px rgba(35, 32, 39, .26); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
.thq-home h1, .thq-home h2, .thq-home h4, .thq-home p { margin: 0; }
.thq-home a { text-decoration: none; color: inherit; }
.thq-home .wrap { max-width: 1340px; margin: 0 auto; padding: 0 22px; }

/* ============ HERO (centered) ============ */
.thq-home .hero { border-bottom: 1px solid var(--line); text-align: center; }
.thq-home .hero .wrap { padding-top: 88px; padding-bottom: 76px; }
.thq-home .hero-kicker { display: inline-flex; justify-content: center; align-items: center; gap: 9px; font-family: var(--mono); font-weight: 600; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--grey); margin-bottom: 20px; }
.thq-home h1 { font-family: var(--sans); font-weight: 650; font-size: clamp(38px, 4.8vw, 58px); letter-spacing: -0.03em; line-height: 1.02; color: var(--ink); margin: 0 auto 18px; }
.thq-home .lede { font-family: var(--sans); font-size: 16.5px; line-height: 1.6; color: var(--abbey); max-width: 600px; margin: 0 auto; }

/* Search box + Ask AI button (both open Fern's own dialogs, see landing-home.js) */
.thq-home .searchrow { display: flex; gap: 14px; max-width: 780px; margin: 42px auto 0; text-align: left; }
.thq-home .sbox { flex: 1; min-width: 0; display: flex; align-items: center; gap: 13px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 0 18px; height: 58px; box-shadow: var(--shadow-soft); transition: box-shadow .25s ease, border-color .25s ease; cursor: text; }
.thq-home .sbox:hover, .thq-home .sbox:focus-within { border-color: var(--platinium); box-shadow: var(--shadow-hover); }
.thq-home .sbox:focus-visible { border-color: var(--platinium); box-shadow: var(--shadow-hover); }
.thq-home .sbox .bs-ico { flex: none; display: flex; }
.thq-home .sbox input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-family: var(--sans); font-size: 16.5px; color: var(--ink); cursor: text; }
.thq-home .sbox input::placeholder { color: var(--grey); }
.thq-home .sbox kbd { flex: none; font-family: var(--mono); font-size: 12px; color: var(--grey); background: var(--soft); border: 1px solid var(--line); border-radius: 6px; padding: 2px 9px; }
.thq-home .btn-ask { flex: none; display: inline-flex; align-items: center; gap: 10px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; height: 58px; padding: 0 22px; font-family: var(--sans); font-weight: 650; font-size: 16px; color: var(--ink); box-shadow: var(--shadow-soft); transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease; }
.thq-home .btn-ask:hover { border-color: var(--ink); box-shadow: var(--shadow-hover); transform: translateY(-1px); }
.thq-home .btn-ask:focus-visible { border-color: var(--ink); box-shadow: var(--shadow-hover); transform: translateY(-1px); }

/* ============ SECTION SCAFFOLD ============ */
.thq-home .sec-head { display: flex; align-items: baseline; gap: 16px; padding: 44px 0 26px; }
.thq-home .sec-head h2 { font-family: var(--sans); font-weight: 650; font-size: 24px; letter-spacing: -0.02em; color: var(--ink); }
.thq-home .sec-head .rule { flex: 1; height: 1px; background: var(--line); }

/* ============ CATALOG: PRODUCTS / RESOURCES 50-50 ============ */
.thq-home .catalog { padding-bottom: 72px; }
.thq-home .catalog2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px; align-items: start; }
.thq-home .stack { display: grid; gap: 22px; }

/* ============ CARDS ============ */
.thq-home .rcard { position: relative; display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--line); border-radius: 16px; background: var(--white); padding: 24px 84px 22px 26px; box-shadow: var(--shadow-soft); transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease, border-color .3s ease; }
.thq-home .rcard:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: var(--platinium); }
.thq-home .rcard:focus-visible { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: var(--platinium); }
.thq-home .rcard .rno { font-family: var(--mono); font-size: 12px; font-weight: 600; color: var(--pink-dark); letter-spacing: .08em; }
.thq-home .rcard h4 { font-family: var(--sans); font-weight: 650; font-size: 16.5px; color: var(--ink); }
.thq-home .rcard p { font-family: var(--sans); font-size: 13.5px; line-height: 1.6; color: var(--abbey); }
.thq-home .pcard h4 { font-size: 20px; letter-spacing: -0.015em; }
.thq-home .pcard .meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 4px; }
.thq-home .mchip { font-family: var(--mono); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; color: var(--pink-dark); background: var(--pink-tint); border: 1px solid var(--pink-soft); border-radius: 6px; padding: 3px 8px; }
.thq-home .go2 { position: absolute; top: 22px; right: 22px; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: var(--white); transition: transform .25s ease, border-color .25s ease; }
.thq-home .rcard:hover .go2 { transform: translateX(4px); border-color: var(--ink); }
.thq-home .rcard:focus-within .go2 { transform: translateX(4px); border-color: var(--ink); }
.thq-home .lockchip { display: inline-flex; align-items: center; gap: 5px; vertical-align: 2px; margin-left: 8px; font-family: var(--mono); font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #c0392b; background: #fdeeec; border: 1px solid #f5cbc4; border-radius: 999px; padding: 3px 9px; }

/* ============ FOOTER ============ */
.thq-home .thq-foot { border-top: 1px solid var(--line); background: var(--soft); padding: 34px 0; }
.thq-home .foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.thq-home .foot .flogo { display: flex; align-items: center; }
.thq-home .foot .flogo img { height: 15px; width: auto; display: block; margin: 0; }
.thq-home .foot .flinks { display: flex; gap: 20px; font-family: var(--sans); font-size: 12.5px; color: var(--grey); }
.thq-home .foot .flinks a:hover { color: var(--ink); }
.thq-home .foot .flinks a:focus-visible { color: var(--ink); }
.thq-home .foot .fnote { font-family: var(--sans); font-size: 12px; color: var(--grey); }
.thq-home .fnote .fco { color: var(--ink-2); border-bottom: 1px solid var(--platinium); padding-bottom: 1px; transition: color .2s ease, border-color .2s ease; }
.thq-home .fnote .fco:hover { color: var(--ink); border-color: var(--pink); }
.thq-home .fnote .fco:focus-visible { color: var(--ink); border-color: var(--pink); }

/* Fern's own header controls are hidden on this page only -- the hero's search box and
 * Ask AI button are the entry points (see landing-home.js). `:has()` scopes it to pages
 * that render .thq-home, because Fern gives <body> no per-page class to key on. Every
 * other page keeps its header controls. */
body:has(.thq-home) #fern-search-button,
body:has(.thq-home) #fern-ask-ai-button,
body:has(.thq-home) .fern-product-selector { display: none; }

/* Developer Hub is the landing page, not a product: drop it from the product selector
 * on every page. Fern has no per-product "hide from selector" setting. */
.fern-product-item-link[href$="/developer-hub"],
.fern-product-selector a[href$="/developer-hub"],
.fern-product-tabs a[href$="/developer-hub"] { display: none !important; }

/* ============ RESPONSIVE ============ */
@media (max-width: 940px) {

  .thq-home .hero .wrap { padding-top: 56px; padding-bottom: 48px; }
  .thq-home .catalog2 { grid-template-columns: minmax(0, 1fr); gap: 8px; }

}
@media (max-width: 560px) {

  .thq-home .wrap { padding: 0 16px; }
  .thq-home h1 { font-size: clamp(32px, 10vw, 40px); }
  .thq-home .lede { font-size: 15px; }
  .thq-home .searchrow { margin-top: 30px; gap: 10px; }
  .thq-home .sbox { height: 50px; padding: 0 14px; }
  .thq-home .sbox input { font-size: 15px; }
  .thq-home .sbox kbd { display: none; }
  .thq-home .btn-ask { height: 50px; padding: 0 16px; font-size: 14.5px; }
  .thq-home .sec-head { padding: 34px 0 20px; gap: 12px; flex-wrap: wrap; }
  .thq-home .sec-head h2 { font-size: 21px; }
  .thq-home .sec-head .rule { min-width: 40px; }
  .thq-home .catalog { padding-bottom: 48px; }
  .thq-home .rcard { padding: 20px 70px 18px 20px; }
  .thq-home .go2 { width: 36px; height: 36px; top: 18px; right: 16px; }
  .thq-home .foot { justify-content: center; text-align: center; }

}

/*
 * Mobile header fit.
 *
 * The header row is a single flex line: logo, search + Ask AI, then the mobile
 * menu button. The Ask AI trigger doesn't shrink, so its localized label
 * ("Yapay zekaya sor", "Perguntar à IA") widens the row enough to push the menu
 * button past the right edge of narrow viewports. Below the header's desktop
 * breakpoint (1024px) the trigger is reduced to its sparkles icon; the label is
 * unchanged on desktop.
 */

@media (max-width: 1023px) {

  #fern-ask-ai-button {
    width: 2.25rem;
    padding-left: 0;
    padding-right: 0;
  }

  #fern-ask-ai-button .fern-button-text {
    display: none;
  }

}

/* Links whose only visible content is an image (e.g. ReadMe card tables): no
   external-link icon, no stray line breaks around the image. */
.fern-prose a.fern-mdx-link:has(> img) > .external-link-icon,
.fern-prose a.fern-mdx-link:has(> img) > br {
  display: none;
}

/* Network/asset logos in ReadMe tables are SVGs with mixed intrinsic sizes
   (some 32x32, some only a viewBox, which fills the cell). Render them all
   at the same size. */
.fern-table td img[src*=".svg"] {
  width: 32px;
  height: 32px;
  object-fit: contain;
  margin: 0;
}

/* ReadMe rendered "smart"-sized images at max-height 450px (phone screenshots stay
   phone-sized instead of filling the column). Mirror that for all prose images:
   landscape screenshots are barely affected, portrait ones shrink to ~200px wide. */
.fern-prose img {
  max-height: 450px;
  width: auto;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Changelog overview: drop the empty TOC column Fern keeps beside the feed so
   the feed centers in the full content width. */
.fern-main:has(.fern-layout-changelog-overview) > #fern-toc,
.fern-main:has(.fern-layout-changelog .fern-changelog-feed) > #fern-toc {
  display: none !important;
}

.fern-layout-changelog-overview > article,
.fern-layout-changelog:has(> article > .fern-changelog-feed) > article {
  max-width: 72rem;
  margin-inline: auto;
}

/* Top-level sidebar sections render as ReadMe-style category headers:
   uppercase, bold, small and muted. */
.fern-sidebar-heading .fern-sidebar-heading-content {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--grayscale-a11);
}