"use client"
import type { PhilanthropicData } from '@/lib/strapi/types'

interface PhilanthropicWatermarkProps {
  data: PhilanthropicData
}

export default function PhilanthropicWatermark({ data }: PhilanthropicWatermarkProps) {
  return (
    <section className="relative overflow-hidden bg-transparent lg:px-5 pb-[10px]">
      <div className="w-full max-w-[1297px] mx-auto">
        {/* Watermark Background Text */}
        <div className="relative pointer-events-none select-none" aria-hidden="true">
          <p
            className="m-0 whitespace-normal sm:whitespace-nowrap text-center font-heading text-[40px] sm:text-[60px] md:text-[80px] font-bold leading-[75%] tracking-[-1px] text-[rgba(16,36,67,0.08)] lg:text-[110px] lg:tracking-[-3px] xl:text-[120px] break-words"
          >
            {data.watermarkText || 'Philanthropic Activities'}
          </p>
        </div>
      </div>
    </section>
  )
}