<div className="grid w-full max-w-4xl gap-8 md:grid-cols-2">
  <SectionTitle
    headingSize="xl"
    title="Enterprise transformation"
    description="Large section leads for major page moments."
    align="start"
  />
  <SectionTitle
    headingSize="lg"
    title="Performance improvement"
    description="Default section leads for most content bands."
    align="start"
  />
  <SectionTitle
    headingSize="md"
    title="Transaction services"
    description="Medium section leads for tighter page groups."
    align="start"
  />
  <SectionTitle
    headingSize="sm"
    title="Risk review"
    description="Small section leads for compact supporting content."
    align="start"
  />
</div>

<SectionTitle
  title="Work with senior operators"
  description={
    <>
      <p>
        Our teams join clients when the choices are urgent and the
        operating facts are still moving.
      </p>
      <p>
        The model keeps leadership close to the work from diagnosis
        through delivery.
      </p>
    </>
  }
  align="start"
/>
<ButtonGroup
  primaryAction={<Button>Meet our people</Button>}
  secondaryAction={<Button variant="outline">View open roles</Button>}
/>

<div className="w-full max-w-5xl space-y-8">
  <div className="flex flex-col items-start gap-6">
    <SectionTitle
      title="Latest insights"
      description="Briefings for leaders working through liquidity, diligence, and operational change."
      align="start"
    />
    <ButtonGroup
      primaryAction={<Button rightIcon={<ArrowRight />}>View all insights</Button>}
      secondaryAction={<Button variant="outline">Subscribe</Button>}
    />
  </div>
  <Grid columns={3} gap="lg">
    <ContentCard
      alignment="vertical"
      media={{
        type: "image",
        src: "/brand/editorial-1.jpg",
        alt: "Consultants reviewing project notes at a table",
      }}
      title="Liquidity decisions need one operating rhythm"
      excerpt="How leadership teams connect cash, margin, and working capital in the same cadence."
      href="/insights/liquidity-rhythm"
    />
    <ContentCard
      alignment="vertical"
      media={{
        type: "image",
        src: "/brand/editorial-2.jpg",
        alt: "Printed materials arranged for a project review",
      }}
      title="Diligence that survives day one"
      excerpt="What deal teams can carry from findings into action without losing momentum."
      href="/insights/diligence-day-one"
    />
    <ContentCard
      alignment="vertical"
      media={{
        type: "image",
        src: "/brand/ship.webp",
        alt: "Container ship underway",
      }}
      title="Supply shocks are finance events"
      excerpt="A practical view of translating disruption into inventory and cash decisions."
      href="/insights/supply-shocks-finance"
    />
  </Grid>
</div>