import type { Metadata } from 'next'
import Link from 'next/link'

export const metadata: Metadata = { title: 'Page Not Found' }

export default function NotFound() {
  return (
    <section className="section" style={{ minHeight: '70vh', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
      <div className="has-text-centered">
        <p style={{ fontSize: '5rem', lineHeight: 1, marginBottom: '1rem' }}>🎈</p>
        <h1 className="title is-2">Page not found</h1>
        <p className="subtitle is-5 has-text-grey" style={{ marginBottom: '2rem' }}>
          Looks like this balloon floated away.
        </p>
        <div className="buttons is-centered">
          <Link href="/" className="button is-info is-medium">Back to shop</Link>
          <a href="https://beachpartyballoons.com/contact/" className="button is-light is-medium">Contact us</a>
        </div>
      </div>
    </section>
  )
}