process.tsx

import { Section } from '@/components/section'
import { Subheading } from '@/components/subheading'
import { Heading } from '@/components/heading'
import { Paragraph } from '@/components/paragraph'
import { Columns, Column } from '@/components/columns'
import { Card4 } from '@/components/card-4'
import { Span } from '@/components/span'
import { WhimsicalArrow } from '@/components/whimsical-arrow'

export default function Process() {
  return (
    <Section className="py-30 bg-gradient-to-br from-body-light to-body">
      <div className="text-center max-w-4xl mx-auto mb-16">
        <Subheading className="mb-6">Our Branding Process</Subheading>
        <Heading as="h2">
          A strategic approach to building brands that resonate with your
          audience
        </Heading>
      </div>
      <Columns