`src/app/about/page.tsx`

94 lines
import type { Metadata } from 'next'
import Link from 'next/link'
import Navbar from '@/components/shared/Navbar'

export const metadata: Metadata = {
  title: 'About — I was Cute',
  description:
    'What I was Cute is, how childhood-photo licensing works, and why we built a rights-cleared marketplace for the photos you already own.',
}

const SECTIONS: { heading: string; body: string[] }[] = [
  {
    heading: 'What is I was Cute?',
    body: [
      'I was Cute is a marketplace for the photographs of your own childhood. Everyone has a shoebox — or a phone camera roll — full of birthday parties, first days of school, beach vacations and Halloween costumes. Those images have real value to publishers, brands, editorial outlets and researchers building respectful, consent-based image sets. We give you a straightforward way to license them and earn royalties, while keeping full control of how they can be used.',
    ],
  },
  {
    heading: 'How licensing works',
    body: [
      'Upload a photo, confirm that you hold the rights to it, and choose the license terms you are comfortable with — editorial only, commercial, or excluded from AI-training use entirely. Every submission goes through a copyright and likeness-release check before it is ever listed, so nothing is offered for license until the rights are clear.',
      'When a licensee purchases usage of your photo, you receive a royalty. You set the boundaries up front, you can withdraw a photo from the marketplace at any time, and you are never asked to sign away ownership — you are licensing use, not selling the image.',
    ],
  },
  {
    heading: 'Who it is for',
    body: [
      'For the people in the photos and the families who took them: a way to turn a drawer of old prints into a small, ongoing source of income on your own terms. For licensees: access to authentic, rights-cleared imagery with documented consent, instead of scraped or ambiguously-sourced pictures.',
    ],
  },
  {
    heading: 'Our commitment to consent',
    body: [
      'Consent is the foundation of the whole service. We do not accept photos of people who have not agreed to be listed, we honor removal requests, and we never knowingly handle images of children under 13 for licensing. If you ever want a photo taken down, contact us and we will remove it.',
    ],
  },
]

export default function AboutPage() {
  return (
    <>
      <Navbar />
      <main
        className="flex-1 px-6 py-16 md:px-12"
        style={{ background: 'var(--color-cream)', color: 'var(--color-brown)' }}
      >
        <div className="mx-auto max-w-2xl">
          <p
            className="text-xs uppercase tracking-[0.2em] mb-3"
            style={{ color: 'var(--color-warm-gray)' }}
          >
            About
          </p>
          <h1 className="text-4xl font-black tracking-tighter mb-8">
            Your childhood photos, legally licensed.
          </h1>

          {SECTIONS.map(({ heading, body }) => (
            <section key={heading} className="mb-10">
              <h2 className="text-xl font-bold mb-3">{heading}</h2>
              {body.map((p, i) => (
                <p
                  key={i}
                  className="mb-3 leading-relaxed"
                  style={{ color: 'var(--color-warm-gray)' }}
                >
                  {p}
                </p>
              ))}
            </section>
          ))}

          <div className="flex flex-wrap gap-3 mt-12">
            <Link
              href="/licensor"
              className="px-5 py-2.5 rounded-2xl text-sm font-semibold transition-all hover:scale-105"
              style={{ background: 'var(--color-peach)', color: 'var(--color-brown)' }}
            >
              Upload a photo
            </Link>
            <Link
              href="/contact"
              className="px-5 py-2.5 rounded-2xl text-sm font-semibold transition-all hover:scale-105"
              style={{ background: 'var(--color-cream-dark)', color: 'var(--color-brown)' }}
            >
              Get in touch
            </Link>
          </div>
        </div>
      </main>
    </>
  )
}