import { ImageResponse } from 'next/og'

export const runtime = 'edge'

export const alt = 'Cihat Cengiz · Digital Ventures & Systems'
export const size = {
  width: 1200,
  height: 630,
}
export const contentType = 'image/png'

export default async function Image() {
  return new ImageResponse(
    (
      <div
        style={{
          height: '100%',
          width: '100%',
          display: 'flex',
          flexDirection: 'column',
          alignItems: 'center',
          justifyContent: 'center',
          backgroundColor: '#000',
          fontFamily: 'system-ui, sans-serif',
        }}
      >
        <div
          style={{
            display: 'flex',
            flexDirection: 'column',
            alignItems: 'center',
            justifyContent: 'center',
          }}
        >
          <h1
            style={{
              fontSize: 80,
              fontWeight: 700,
              color: '#fff',
              margin: 0,
              letterSpacing: '-0.02em',
            }}
          >
            Cihat Cengiz
          </h1>
          <p
            style={{
              fontSize: 32,
              color: '#666',
              margin: '20px 0 0 0',
              letterSpacing: '0.1em',
              textTransform: 'uppercase',
            }}
          >
            Digital Ventures & Systems
          </p>
        </div>
        <div
          style={{
            position: 'absolute',
            bottom: 60,
            display: 'flex',
            alignItems: 'center',
            gap: 12,
          }}
        >
          <span style={{ color: '#444', fontSize: 24 }}>cihat.org</span>
        </div>
      </div>
    ),
    {
      ...size,
    }
  )
}

