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

# Request a Demo of Aspect Workflows

> See Aspect Workflows on a real Bazel monorepo: CI runners, remote cache, remote execution, and the Build & Test UI, shown by a Bazel engineer in 30 minutes.

export const MarketingPage = () => <div className="marketing-page-marker" style={{
  display: "none"
}} />;

export const RequestDemoForm = () => <form id="request-demo-form" name="Request a Demo Form" method="POST" onSubmit={e => {
  e.preventDefault();
  const form = e.currentTarget;
  try {
    const guid = "fa37ba9f-e6db-4237-9929-f427a475e014";
    const fsid = "xykanvqr";
    const fields = Array.from(new FormData(form).entries()).map(([name, value]) => ({
      name,
      value: String(value)
    }));
    const hutk = (document.cookie.match(/hubspotutk=([^;]+)/) || [])[1];
    if (guid) fetch("https://api.hsforms.com/submissions/v3/integration/submit/46621241/" + guid, {
      method: "POST",
      keepalive: true,
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify({
        fields,
        context: {
          pageUri: window.location.href,
          pageName: document.title,
          ...hutk ? {
            hutk
          } : {}
        }
      })
    }).catch(() => {});
    if (fsid) fetch("https://formspree.io/f/" + fsid, {
      method: "POST",
      keepalive: true,
      headers: {
        Accept: "application/json",
        "Content-Type": "application/json"
      },
      body: JSON.stringify(Object.fromEntries(new FormData(form)))
    }).catch(() => {});
  } catch (err) {}
  setTimeout(() => {
    window.location.href = "/thank-you";
  }, 400);
}}>
   <div className="mt-8 space-y-4">
    <div className="grid grid-cols-2 gap-3">
      <input type="text" name="firstname" placeholder="First Name" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition" />
      <input type="text" name="lastname" placeholder="Last Name" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition" />
    </div>
    <div className="grid grid-cols-2 gap-3">
      <input type="email" name="email" placeholder="Company Email" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition" />
      <input type="text" name="company" placeholder="Company Name" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition" />
    </div>
    <select name="developer_count" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition">
      <option value="">How many engineers?</option>
      <option value="1-10">1-10</option>
      <option value="11-50">11-50</option>
      <option value="51-200">51-200</option>
      <option value="201-1000">201-1,000</option>
      <option value="1000+">1,000+</option>
    </select>
    <select name="bazel_stage" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition">
      <option value="">Where are you with Bazel?</option>
      <option value="Using Bazel in production">Using Bazel in production</option>
      <option value="Migrating to Bazel">Migrating to Bazel</option>
      <option value="Evaluating Bazel">Evaluating Bazel</option>
    </select>
    <select name="ci_provider" required className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition">
      <option value="">Which CI do you use today?</option>
      <option value="GitHub Actions">GitHub Actions</option>
      <option value="CircleCI">CircleCI</option>
      <option value="GitLab">GitLab</option>
      <option value="Buildkite">Buildkite</option>
      <option value="Multiple / Other">Multiple / Other</option>
    </select>
    <textarea name="message" placeholder="Tell us about your build: languages, repo size, what hurts today" rows={4} className="w-full px-4 py-3 rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 text-zinc-900 dark:text-white placeholder-zinc-400 focus:border-blue-500 focus:ring-2 focus:ring-blue-500/20 outline-none transition resize-y" />
    <div className="flex items-center gap-4">
      <button type="submit" className="demo-gradient-btn inline-flex items-center px-6 py-3 rounded-lg font-semibold transition cursor-pointer">Request a Demo</button>
    </div>
   </div>
  </form>;

export const Section = ({children, className = "", gray = false, dark = false, id}) => <section id={id} className={`w-full flex justify-center px-4 py-16 md:py-24 ${gray ? "bg-gray-50 dark:bg-zinc-900" : dark ? "bg-zinc-900 dark:bg-zinc-950" : ""} ${className}`}>
    <div className="w-full" style={{
  maxWidth: "1140px"
}}>
      {children}
    </div>
  </section>;

<MarketingPage />

<Section>
  <div className="grid md:grid-cols-2 gap-12">
    <div>
      <h1 className="text-3xl md:text-4xl font-semibold text-zinc-900 dark:text-white">Request a demo</h1>

      <p className="mt-4 text-lg text-zinc-600 dark:text-zinc-300">
        Thirty minutes with a Bazel engineer, on a real monorepo. Tell us a little about your build and we'll reach out to schedule it.
      </p>

      <RequestDemoForm />
    </div>

    <div>
      <div className="p-8 rounded-2xl bg-gradient-to-br from-zinc-50 to-blue-50 dark:from-zinc-800/60 dark:to-blue-900/10 border border-zinc-200 dark:border-zinc-700 sticky top-24">
        <h2 className="text-2xl font-semibold text-zinc-900 dark:text-white">What to expect</h2>

        <ul className="mt-6 space-y-4">
          <li className="flex items-start gap-3">
            <span className="flex-shrink-0 w-6 h-6 rounded-full bg-blue-600 text-white text-sm font-bold flex items-center justify-center mt-0.5">✓</span>

            <div>
              <p className="font-semibold text-zinc-900 dark:text-white">An engineer, not a sales deck</p>
              <p className="text-sm text-zinc-500 dark:text-zinc-400">Your demo is given by a Bazel engineer who deploys and tunes Aspect Workflows for customers, ready for your hardest questions.</p>
            </div>
          </li>

          <li className="flex items-start gap-3">
            <span className="flex-shrink-0 w-6 h-6 rounded-full bg-blue-600 text-white text-sm font-bold flex items-center justify-center mt-0.5">✓</span>

            <div>
              <p className="font-semibold text-zinc-900 dark:text-white">The platform on a real monorepo</p>
              <p className="text-sm text-zinc-500 dark:text-zinc-400">Bazel-tuned CI runners, the remote cache, remote execution, Selective Delivery, Marvin on pull requests, and the Build & Test UI, live.</p>
            </div>
          </li>

          <li className="flex items-start gap-3">
            <span className="flex-shrink-0 w-6 h-6 rounded-full bg-blue-600 text-white text-sm font-bold flex items-center justify-center mt-0.5">✓</span>

            <div>
              <p className="font-semibold text-zinc-900 dark:text-white">Your constraints, addressed</p>
              <p className="text-sm text-zinc-500 dark:text-zinc-400">Bring your infrastructure requirements: GovCloud, air-gapped networks, strict security postures, unusual hardware needs. We deploy into these environments routinely.</p>
            </div>
          </li>

          <li className="flex items-start gap-3">
            <span className="flex-shrink-0 w-6 h-6 rounded-full bg-blue-600 text-white text-sm font-bold flex items-center justify-center mt-0.5">✓</span>

            <div>
              <p className="font-semibold text-zinc-900 dark:text-white">A clear next step</p>
              <p className="text-sm text-zinc-500 dark:text-zinc-400">If it looks right for your team, we'll scope a 30-day trial on dedicated, single-tenant infrastructure: your cloud account or ours.</p>
            </div>
          </li>
        </ul>

        <p className="mt-8 pt-6 border-t border-zinc-200 dark:border-zinc-700 text-sm text-zinc-500 dark:text-zinc-400">
          Ready to go hands-on instead?{" "}
          <a href="/trial" className="text-blue-600 dark:text-blue-400 font-semibold hover:underline">Start a free trial →</a>
        </p>
      </div>
    </div>
  </div>
</Section>