> ## Documentation Index
> Fetch the complete documentation index at: https://developers.fireblocks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Fireblocks Developer Portal

> Build with Fireblocks. Docs, SDKs, APIs, and the changelog — in one place.

export const MOCK_EVENTS = [{
  title: 'Stablecoin Soirée at Money20/20',
  date: '2026-06-03',
  slug: 'https://luma.com/psosqg2k',
  summary: 'Aperitifs, seated dinner, and a conversation about where stablecoins are going. Hosted by Zerion and Dynamic.',
  image: '/images/events/stablecoin-soiree-amsterdam.png',
  category: 'Community',
  location: 'Amsterdam',
  tags: ['Stablecoins']
}, {
  title: 'Del Block a la Cancha — World Cup Night by Fireblocks & XFX',
  date: '2026-06-17',
  slug: 'https://luma.com/he4j908j',
  summary: 'Colombia vs. Uzbekistan watch party at Maizajo — after the Bitso Stablecoin Conference.',
  image: '/images/events/world-cup-watch-party.png',
  category: 'Community',
  location: 'Mexico City',
  tags: ['Fireblocks & XFX']
}, {
  title: 'Stablecon Salon — Summer Mixer',
  date: '2026-07-15',
  slug: 'https://luma.com/stablecon-nou2',
  summary: 'Evening networking with founders, operators, and institutions shaping the future of stablecoins. Co-hosted with Fireblocks and Dynamic.',
  image: '/images/events/stablecon-salon.png',
  category: 'Community',
  location: 'New York City',
  tags: ['Stablecoins']
}, {
  title: 'Tetra x IRL Presents — FLOW',
  date: '2026-07-21',
  slug: 'https://luma.com/cyblwwjm',
  summary: 'Stablecoin panel, live CADD payments demo, and music at Rhythm Toronto. Co-sponsored by Fireblocks.',
  image: '/images/events/tetra-irl-flow.png',
  category: 'Community',
  location: 'Toronto',
  tags: ['Stablecoins & Payments']
}, {
  title: 'Aleo x Dynamic Summer Happy Hour',
  date: '2026-08-19',
  slug: 'https://luma.com/AleoDynamicHHNYC',
  summary: 'Networking, light bites, and conversations on privacy and compliance at the Fireblocks and Dynamic office.',
  image: '/images/events/aleo-dynamic-happy-hour.png',
  category: 'Community',
  location: 'New York City',
  tags: ['Privacy & Compliance']
}, {
  title: 'Building the Agentic Economy with Fireblocks, Circle & BlockRun',
  date: '2026-08-27',
  slug: 'https://luma.com/lon7mu2d',
  summary: 'Panel and live demos on how AI agents discover services and transact in real time. Pizza and networking at Fireblocks HQ.',
  image: '/images/events/agentic-economy.png',
  category: 'Community',
  location: 'New York City',
  tags: ['Agentic']
}];

export const MOCK_BLOG = [{
  title: "Institutional Approval Workflows Don't Match Hyperliquid's Speed",
  date: '2026-08-17',
  slug: 'https://www.fireblocks.com/blog/institutional-approval-workflows-hyperliquid',
  summary: 'Can an institution\'s internal approval workflow keep pace with a DEX that settles in milliseconds?',
  image: '/images/blog/hyperliquid-approval-workflows.png',
  category: 'For Developers',
  tags: ['Wallets & Digital Asset Custody']
}, {
  title: 'Why Enterprise AI Agents Need a Wallet Layer',
  date: '2026-07-31',
  slug: 'https://www.fireblocks.com/blog/enterprise-agentic-payments-wallet-layer',
  summary: 'Enterprise AI agents are starting to spend money on behalf of teams — the wallet layer underneath is the piece most haven\'t built yet.',
  image: '/images/blog/enterprise-ai-wallet-layer.png',
  category: 'Expert Commentary',
  tags: ['Agentic']
}, {
  title: 'Embedded Wallets Beyond Onboarding: A 90-Day Rollout Plan',
  date: '2026-06-27',
  slug: 'https://www.fireblocks.com/blog/embedded-wallets-90-day-rollout-plan',
  summary: 'From a working wallet on day one to a fully extended operation 90 days later — what a real rollout looks like.',
  image: '/images/blog/embedded-wallets-90-day-rollout.png',
  category: 'Industry Insights',
  tags: ['Dynamic']
}, {
  title: 'Fireblocks Flow: Enabling Merchants to Accept Stablecoin Payments',
  date: '2026-06-02',
  slug: 'https://www.fireblocks.com/blog/introducing-fireblocks-flow',
  summary: 'Stablecoin acceptance infrastructure for PSPs and fintechs — accept from any wallet, settle in the stablecoin of your choice.',
  image: '/images/blog/fireblocks-flow.png',
  category: 'Product & Platform Updates',
  tags: ['Stablecoins & Payments', 'Wallets & Digital Asset Custody']
}, {
  title: 'Fireblocks Powers an Agentic Payments Future for PSPs and Fintechs',
  date: '2026-05-20',
  slug: 'https://www.fireblocks.com/blog/agentic-payments-suite-psp-fintech',
  summary: 'Introducing the Agentic Payments Suite — infrastructure for agent-initiated payments using any stablecoin, on any blockchain.',
  image: '/images/blog/agentic-payments-suite.png',
  category: 'Product & Platform Updates',
  tags: ['Stablecoins & Payments', 'Wallets & Digital Asset Custody']
}, {
  title: 'Fireblocks Supports 150 Public Blockchains, Leading the Market in Blockchain Coverage',
  date: '2026-02-03',
  slug: 'https://www.fireblocks.com/blog/leader-in-public-blockchain-support-coverage',
  summary: 'Broader coverage than any other institutional digital asset infrastructure provider — 46 new public blockchains integrated in 2025.',
  image: '/images/blog/blockchain-coverage-150.png',
  category: 'Product & Platform Updates',
  tags: ['Wallets & Digital Asset Custody']
}];

export const RELEASES = [{
  title: "SDK v33.0.0",
  date: "2026-09-30",
  slug: "/changelog#2026-09-30",
  summary: "27 updates across Trading, Canton, and UTXO Management, including breaking changes."
}, {
  title: "SDK v32.0.0",
  date: "2026-09-23",
  slug: "/changelog#2026-09-23",
  summary: "12 updates across Webhooks V2, Compliance Orchestrator, and Approvals, including breaking changes."
}, {
  title: "SDK v31.0.0",
  date: "2026-09-15",
  slug: "/changelog#2026-09-15",
  summary: "9 updates across Webhooks V2, Fiat accounts, and Connected Accounts, including breaking changes."
}, {
  title: "SDK v30.0.0",
  date: "2026-09-08",
  slug: "/changelog#2026-09-08",
  summary: "17 updates across Webhooks V2, Security Posture Management, and Transactions, including breaking changes."
}, {
  title: "SDK v29.0.0",
  date: "2026-09-01",
  slug: "/changelog#2026-09-01",
  summary: "5 updates across Transactions, TRLink, and Compliance, including breaking changes."
}, {
  title: "SDK v28.0.0",
  date: "2026-08-26",
  slug: "/changelog#2026-08-26",
  summary: "3 updates across Security Posture Management, including breaking changes."
}];

export const FinalCTA = () => <>
    <section className="fb-section fb-bg-navy fb-final-cta">
      <div className="fb-container fb-final-cta-inner">
        <h2 className="fb-h2 fb-text-white fb-section-title">Ready to build?</h2>

        <div className="fb-cta-row">
          <a href="https://www.fireblocks.com/developer-sandbox-sign-up" className="fb-cta-primary fb-cta-outline">
            Try in Sandbox →
          </a>
          <a href="/docs/quickstart" className="fb-cta-primary">
            Quickstart →
          </a>
        </div>
      </div>
    </section>

    <footer className="fb-footer fb-bg-navy">
      <div className="fb-container fb-footer-inner">
        <nav className="fb-footer-links">
          <a href="https://www.fireblocks.com/privacy-policy/" target="_self">Privacy Policy</a>
          <a href="https://www.fireblocks.com/cookie-policy/" target="_self">Cookie Policy</a>
          <a href="https://www.fireblocks.com/terms-of-use/" target="_self">Terms of Use</a>
          <a href="https://www.fireblocks.com/fireblocks-regulated-entities/" target="_self">Fireblocks Regulated Entities</a>
        </nav>
        <div className="fb-footer-badges">
          <img src="/images/footer-badges.svg" alt="CCSS, SOC 2, ISO 27001, ISO 27017, ISO 27018, ISO 22301 certifications" height="40" />
        </div>
      </div>
    </footer>
  </>;

export const DynamicSection = () => {
  const CARDS = [{
    n: '01',
    title: 'Embedded wallets overview',
    body: 'How Dynamic fits alongside Fireblocks, and what its wallets unlock.',
    href: '/docs/dynamic-embedded-wallets',
    urlLabel: '/docs/dynamic-embedded-wallets'
  }, {
    n: '02',
    title: 'React quickstart',
    body: 'Add embedded wallets, multi-chain support, and email or social login to a React app.',
    href: 'https://www.dynamic.xyz/docs/javascript/reference/react-quickstart',
    urlLabel: 'dynamic.xyz/docs/javascript'
  }, {
    n: '03',
    title: 'Dynamic API reference',
    body: "Read your Dynamic environment's data and update its settings programmatically.",
    href: 'https://www.dynamic.xyz/docs/api-reference/overview',
    urlLabel: 'dynamic.xyz/docs/api-reference'
  }];
  return <section className="fb-section fb-bg-blue fb-dynamic-section">
      <div className="fb-container">
        <div className="fb-dynamic-top">
          <div>
            <h2 className="fb-h3 fb-text-white fb-section-title">
              Embedded wallets with Dynamic
            </h2>
            <div className="fb-body-l fb-text-grey fb-section-sub">
              Dynamic, a Fireblocks company, builds non-custodial embedded
              wallets with sub-second signing, cross-chain support, and flexible
              recovery across web, iOS, and Android.
            </div>

            <a href="https://www.dynamic.xyz/docs" className="fb-cta-text fb-section-cta" target="_self">
              Browse the full Dynamic docs →
            </a>
          </div>

          <video className="fb-dynamic-video" src="https://marketing-site-assets.dynamic.xyz/hero-home.mp4" autoPlay muted loop playsInline aria-hidden="true"></video>
        </div>

        <div className="fb-grid-community">
          {CARDS.map(c => {
    const isExternal = c.href.startsWith('http');
    return <a key={c.n} href={c.href} className="fb-card-dark" {...isExternal ? {
      target: '_self'
    } : {}}>
                <span className="fb-card-label">{c.n}</span>
                <h3 className="fb-card-title">{c.title}</h3>
                <div className="fb-card-summary">{c.body}</div>
                <span className="fb-mono-accent">{c.urlLabel}</span>
              </a>;
  })}
        </div>
      </div>
    </section>;
};

export const UseCases = () => {
  const CASES = [{
    n: '01',
    title: 'Wallet as a Service',
    body: 'Build programmable wallets at scale. Receive, hold, and send funds for your users with secure MPC infrastructure.',
    href: '/docs/wallet-as-a-service'
  }, {
    n: '02',
    title: 'Treasury Management',
    body: 'Manage institutional digital-asset operations across exchanges and DeFi.',
    href: '/docs/treasury-management'
  }, {
    n: '03',
    title: 'Tokenization',
    body: 'Issue, manage, and distribute digital tokens via smart-contract templates.',
    href: '/docs/tokenization'
  }, {
    n: '04',
    title: 'Self-Custody Infrastructure',
    body: 'Build self-custody solutions with enterprise-grade MPC key management.',
    href: '/docs/self-custody-infrastructure'
  }];
  return <section className="fb-section fb-bg-navy">
      <div className="fb-container">
        <h2 className="fb-h3 fb-text-white fb-section-title fb-stack-lg">Build by use case</h2>

        <div className="fb-grid-use-cases">
          {CASES.map(c => <a key={c.n} href={c.href} className="fb-card-dark">
              <span className="fb-card-label">{c.n}</span>
              <h3 className="fb-card-title">{c.title}</h3>
              <div className="fb-card-summary">{c.body}</div>
              <span className="fb-cta-text">Read the guide →</span>
              <div className="fb-mono-accent mt-4">{c.href}</div>
            </a>)}
        </div>

        <a href="https://www.fireblocks.com/customers" className="fb-customer-stories-cta">
          <img src="/images/customer-stories-bg.png" alt="" className="fb-customer-stories-bg" aria-hidden="true" noZoom />
          <div className="fb-customer-stories-content">
            <div>
              <span className="fb-customer-stories-label">Customer Stories</span>
              <span className="fb-customer-stories-text">
                See how engineering teams at leading institutions build and scale on Fireblocks.
              </span>
            </div>
            <span className="fb-customer-stories-link">View stories →</span>
          </div>
        </a>
      </div>
    </section>;
};

export const ActivityFeed = ({releases = [], mockBlog = [], mockEvents = []}) => {
  const MAX_VISIBLE = 6;
  const [active, setActive] = useState('all');
  const tabs = [{
    id: 'all',
    label: 'All'
  }, {
    id: 'release',
    label: 'Releases'
  }, {
    id: 'blog',
    label: 'Blog'
  }, ...mockEvents.length > 0 ? [{
    id: 'event',
    label: 'Events'
  }] : []];
  let counter = 0;
  const feed = [...releases.map(r => ({
    ...r,
    type: 'release',
    _id: 'rel-' + counter++
  })), ...mockBlog.map(b => ({
    ...b,
    type: 'blog',
    _id: 'blog-' + counter++
  })), ...mockEvents.map(e => ({
    ...e,
    type: 'event',
    _id: 'evt-' + counter++
  }))].sort((a, b) => a.date < b.date ? 1 : -1);
  const visible = active === 'all' ? feed.slice(0, MAX_VISIBLE) : feed.filter(it => it.type === active).slice(0, MAX_VISIBLE);
  const todayStr = new Date().toISOString().slice(0, 10);
  return <section className="fb-section fb-bg-grey">
      <div className="fb-container">
        <h2 className="fb-h3 fb-text-navy fb-section-title fb-stack-lg">What's happening</h2>

        <div className="fb-tab-strip" role="tablist" aria-label="Activity filters">
          {tabs.map(tab => <button key={tab.id} type="button" role="tab" aria-selected={active === tab.id} className={active === tab.id ? 'fb-tab fb-tab--active' : 'fb-tab'} onClick={() => setActive(tab.id)}>
              {tab.label}
            </button>)}
        </div>

        <div className="fb-grid-feed">
          {visible.map(item => {
    const isUpcoming = item.type === 'event' && item.date >= todayStr;
    const cta = item.type === 'blog' ? 'Read →' : item.type === 'event' && isUpcoming ? 'RSVP →' : 'View →';
    return <a key={item._id} href={item.slug} className={'fb-feed-card' + (isUpcoming ? ' fb-feed-card--upcoming' : '')}>
                {item.image && <div className="fb-feed-card-img">
                    <img src={item.image} alt="" loading="lazy" noZoom />
                    {isUpcoming && <span className="fb-upcoming-badge">UPCOMING</span>}
                  </div>}
                <div className="fb-feed-card-body">
                  <div className="fb-feed-meta">
                    <span>
                      {item.category ? <span className="fb-feed-meta-category">{item.category.toUpperCase()}</span> : <span className="fb-feed-meta-label">{item.type.toUpperCase()}</span>}
                      <span>{' / ' + item.date}</span>
                    </span>
                    <span className="fb-feed-cta">{cta}</span>
                  </div>
                  <h3 className="fb-card-title">{item.title}</h3>
                  {item.summary && <div className="fb-card-summary">{item.summary}</div>}
                  {item.location && <div className="fb-feed-location">
                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" /><circle cx="12" cy="10" r="3" /></svg>
                      {item.location}
                    </div>}
                  {item.tags && item.tags.length > 0 && <div className="fb-feed-tags">
                      {item.tags.map(label => <span key={label} className="fb-feed-tag">{label}</span>)}
                    </div>}
                </div>
              </a>;
  })}
        </div>
      </div>
    </section>;
};

export const QuickLinks = () => {
  const LINKS = [{
    n: '01',
    title: 'Quickstart',
    href: '/docs/quickstart',
    desc: 'Set up your first API call in minutes.'
  }, {
    n: '02',
    title: 'Manage API Keys',
    href: '/docs/manage-api-keys',
    desc: 'Create and configure API key pairs.'
  }, {
    n: '03',
    title: 'TypeScript SDK',
    href: '/reference/typescript-sdk',
    desc: 'Type-safe client for Node.js and browsers.'
  }, {
    n: '04',
    title: 'Python SDK',
    href: '/reference/new-python-sdk',
    desc: 'Official Python client library.'
  }, {
    n: '05',
    title: 'Fireblocks CLI',
    href: '/docs/fireblocks-cli',
    desc: 'Manage resources from the command line.'
  }, {
    n: '06',
    title: 'Webhooks',
    href: '/reference/webhooks-overview',
    desc: 'Get real-time event notifications.'
  }, {
    n: '07',
    title: 'Build with AI',
    href: '/docs/building-with-ai',
    desc: 'Integrate Fireblocks with AI agents.'
  }, {
    n: '08',
    title: 'JWT Auth',
    href: '/reference/signing-a-request-jwt-structure',
    desc: 'Sign API requests with RS256 JWTs.'
  }];
  return <section className="fb-section fb-bg-grey">
      <div className="fb-container">
        <h2 className="fb-h3 fb-text-navy fb-section-title">Resources for developers</h2>
        <div className="fb-body-l fb-text-navy fb-section-sub">
          Everything you need to get from zero to your first production transaction.
        </div>

        <div className="fb-grid-quick">
          {LINKS.map(link => <a key={link.n} href={link.href} className="fb-card-light">
              <span className="fb-card-label">{link.n}</span>
              <h3 className="fb-card-title">{link.title}</h3>
              <p className="fb-card-desc">{link.desc}</p>
              <span className="fb-mono-accent">{link.href}</span>
            </a>)}
        </div>
      </div>
    </section>;
};

export const HeroSection = () => {
  const MCP_ENDPOINT = 'https://developers.fireblocks.com/mcp';
  const CURSOR_DEEPLINK = 'https://cursor.com/en/install-mcp?name=fireblocks&config=eyJ1cmwiOiJodHRwczovL2RldmVsb3BlcnMuZmlyZWJsb2Nrcy5jb20vZG9jcy9tY3AifQ==';
  const CLAUDE_CMD = 'claude mcp add --transport http fireblocks-docs https://developers.fireblocks.com/mcp';
  const CODEX_CMD = 'codex mcp add fireblocks-docs --url https://developers.fireblocks.com/mcp';
  const [agent, setAgent] = useState('claude');
  const [copiedMcp, setCopiedMcp] = useState(false);
  const stepsRef = useRef(null);
  useEffect(() => {
    const container = stepsRef.current;
    if (!container) return;
    const targets = container.querySelectorAll('.fb-gs-step, .fb-hero-actions');
    const io = new IntersectionObserver(entries => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          const idx = Array.from(targets).indexOf(entry.target);
          setTimeout(() => entry.target.classList.add('fb-visible'), idx * 120);
          io.unobserve(entry.target);
        }
      });
    }, {
      threshold: 0.15
    });
    targets.forEach(el => io.observe(el));
    return () => io.disconnect();
  }, []);
  const copyCommand = async (command, setter) => {
    try {
      await navigator.clipboard.writeText(command);
      setter(true);
      setTimeout(() => setter(false), 2000);
    } catch (err) {
      console.warn('[copy] clipboard write failed', err);
    }
  };
  const mcpCommand = agent === 'claude' ? CLAUDE_CMD : CODEX_CMD;
  return <section className="fb-hero-section">
      <div className="fb-container fb-hero-banner">
        <div className="fb-hero-copy">
          <h1 className="fb-h2 fb-text-navy fb-hero-title">
            Build with Fireblocks
          </h1>
          <p className="fb-body-l fb-hero-sub">
            Docs, SDKs, APIs, and the changelog. Everything you need to go from first API call to production.
          </p>
        </div>

        <div className="fb-hero-bg" aria-hidden="true">
          <img src="/images/hero-isometric.svg" alt="" noZoom />
        </div>

        <div className="fb-gs-card">
          <div className="fb-gs-card-content" ref={stepsRef}>
            <ol className="fb-gs-steps">
              <li className="fb-gs-step">
                <div className="fb-gs-badge">1</div>
                <div className="fb-gs-step-main">
                  <h3 className="fb-gs-step-title">Add the MCP</h3>
                  <div className="fb-gs-step-desc">
                    Ground your IDE or agent in the official Fireblocks docs.
                  </div>

                  <div className="fb-gs-tabs" role="tablist" aria-label="Choose your agent">
                  {[{
    id: 'claude',
    label: 'Claude Code'
  }, {
    id: 'cursor',
    label: 'Cursor'
  }, {
    id: 'codex',
    label: 'Codex'
  }, {
    id: 'other',
    label: 'Other'
  }].map(a => <button key={a.id} type="button" role="tab" aria-selected={agent === a.id} className={agent === a.id ? 'fb-gs-tab fb-gs-tab--active' : 'fb-gs-tab'} onClick={() => setAgent(a.id)}>
                        {a.label}
                      </button>)}
                  </div>

                  <div className="fb-gs-tab-panel">
                    {agent === 'cursor' && <a href={CURSOR_DEEPLINK} className="fb-cta-primary fb-gs-add-btn">
                        Add to Cursor →
                      </a>}
                    {(agent === 'claude' || agent === 'codex') && <div className="fb-code-block fb-code-block--light fb-gs-code">
                        <span className="fb-mono">
                          <span className="fb-text-bandwidth">$</span> {mcpCommand}
                        </span>
                        <button type="button" className="fb-copy-btn" onClick={() => copyCommand(mcpCommand, setCopiedMcp)} aria-label="Copy command to clipboard">
                          {copiedMcp ? 'Copied' : 'Copy'}
                        </button>
                      </div>}
                    {agent === 'other' && <div className="fb-gs-step-desc">
                        Point any MCP-compatible client at{' '}
                        <span className="fb-mono fb-gs-inline-endpoint">{MCP_ENDPOINT}</span>.
                      </div>}
                  </div>
                </div>
              </li>

              <li className="fb-gs-step">
                <div className="fb-gs-badge">2</div>
                <div className="fb-gs-step-main">
                  <h3 className="fb-gs-step-title">Install the CLI</h3>
                  <div className="fb-gs-step-desc">
                    A typed command for every API operation. Node.js 18+.
                  </div>
                  <div className="fb-code-block fb-code-block--light fb-gs-code">
                    <span className="fb-mono">
                      <span className="fb-text-bandwidth">$</span> npm install -g @fireblocks/fireblocks-cli
                    </span>
                    <button type="button" className="fb-copy-btn" onClick={() => copyCommand('npm install -g @fireblocks/fireblocks-cli', setCopiedMcp)} aria-label="Copy command to clipboard">
                      {copiedMcp ? 'Copied' : 'Copy'}
                    </button>
                  </div>
                </div>
              </li>

              <li className="fb-gs-step fb-gs-step--compact">
                <div className="fb-gs-badge">3</div>
                <div className="fb-gs-step-main">
                  <h3 className="fb-gs-step-title">Ask your agent about Fireblocks</h3>
                  <div className="fb-gs-step-desc">
                    It reads the docs and runs the CLI for you.
                  </div>
                </div>
              </li>
            </ol>

            <div className="fb-cta-row fb-hero-actions">
              <a href="/docs/quickstart" className="fb-cta-primary">
                Full Quickstart Guide →
              </a>
              <a href="/docs/capabilities" className="fb-cta-primary fb-cta-outline">
                Explore Key Features →
              </a>
            </div>
          </div>
        </div>
      </div>
    </section>;
};

export const LandingNav = () => {
  const TABS = [{
    label: 'Guides',
    href: '/docs/introduction'
  }, {
    label: 'SDKs & Tools',
    href: '/reference/typescript-sdk'
  }, {
    label: 'API',
    href: '/reference/api-overview'
  }, {
    label: 'Changelog',
    href: '/changelog'
  }];
  const openSearch = () => {
    const trigger = document.getElementById('search-bar-entry') || document.getElementById('search-bar-entry-mobile');
    if (trigger) {
      trigger.click();
      return;
    }
    document.dispatchEvent(new KeyboardEvent('keydown', {
      key: 'k',
      code: 'KeyK',
      metaKey: true,
      ctrlKey: true,
      bubbles: true
    }));
  };
  return <header className="fb-nav">
      <div className="fb-nav-row fb-nav-row--top">
        <div className="fb-nav-inner">
          <a href="/landing" className="fb-nav-brand" aria-label="Fireblocks Developers home">
            <img src="/images/fb-devs.svg" alt="Fireblocks Developers" className="fb-nav-logo" noZoom />
          </a>

          <button type="button" className="fb-nav-search" onClick={openSearch} aria-label="Search the documentation">
            <span className="fb-nav-search-text">Search or ask AI</span>
            <kbd className="fb-nav-kbd">⌘K</kbd>
          </button>

          <div className="fb-nav-actions">
            <a href="https://www.fireblocks.com/developer-sandbox-sign-up" className="fb-nav-link">
              Try in Sandbox
            </a>
            <a href="https://console.fireblocks.io/v2/" className="fb-nav-signin">
              Sign in →
            </a>
          </div>
        </div>
      </div>

      <div className="fb-nav-row fb-nav-row--tabs">
        <nav className="fb-nav-inner" aria-label="Documentation sections">
          {TABS.map(tab => <a key={tab.href} href={tab.href} className="fb-nav-tab">
              {tab.label}
            </a>)}
        </nav>
      </div>
    </header>;
};

<div className="fb-landing">
  <LandingNav />

  <HeroSection />

  <UseCases />

  <QuickLinks />

  <DynamicSection />

  <ActivityFeed releases={RELEASES} mockBlog={MOCK_BLOG} mockEvents={MOCK_EVENTS} />

  <FinalCTA />
</div>