const AboutPage = () => {

  return (
    <div className="flex flex-col items-center justify-start relative size-full">
      <div className="flex gap-1 grow items-start justify-center content-stretch min-h-px min-w-px pb-0 pt-28 px-6 md:px-12 relative shrink-0 w-full">
        <div className="max-w-[752px]">
          <div className="pb-[27.26%] w-full relative">
            <img
              src="/images/about/banner.png"
              alt="Banner"
              className="inset-0 object-cover absolute"
            />
          </div>

          <div className="mt-12 txt-body-l">
            <div>
              Grow your love story with CrushLevel AI—From "Hi" to "I Do", sparked by every chat
            </div>

            <div className="mt-6">
              At CrushLevel AI, every chat writes a new verse in your love epic—
            </div>
            <div>
              From that tentative "Hi" to the trembling "I do",  find a home for the flirts you never sent,
            </div>
            <div>
              the responses you longed for,
            </div>
            <div>
              and the risky emotional gambles you feared to take.
            </div>

            <div className="mt-8">
              {`Contact Us: ${process.env.NEXT_PUBLIC_EMAIL_CONTACT_US}`}
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}
 
export default AboutPage;