import { PageHeader } from '@/compositions/PageHeader/PageHeader'
import { Section } from '@/components/Section/Section'
import { Container } from '@/components/Container/Container'
import { ContactSection } from '@/compositions/ContactSection/ContactSection'
import { Title } from '@/components/Title/Title'
import { P } from '@/components/Text/Paragraph'
import { Row } from '@/components/Flex/Row'
import { Col } from '@/components/Flex/Col'
import Logo from '@/components/Logo/Logo'

export default function ContactPage() {
  return (
    <>
      <PageHeader
        title={"Kontakt"}
        description={"Haben Sie Fragen, Anregungen oder möchten Sie mit uns in Kontakt treten? Dann sind Sie hier genau richtig."}
      />

      <Section padding={"small"}>
        <Container>
          <Title title={"Pfarrei Heilige Drei Könige"} size="md"></Title>
          <Row>
            <Col>
              <P width={"1/2"}>
                Briesestraße 15 – 17<br/>
                12053 Berlin <br/>
                030-6889120 <br/>
                kontakt@dreikoenige.berlin
              </P>
              <P width={"1/2"}>
                <strong>Geöffnet:</strong><br/>
                Mo. 09 – 13 Uhr <br/>
                Di. 12 – 15 Uhr <br/>
                Do. 10 – 14 Uhr
              </P>
            </Col>
            <Col>
              <Logo
                withText={true}
                color={"#426156"}
                textColor={"#728F8D"}
                height={140}
              />
            </Col>
          </Row>

        </Container>
      </Section>

      <ContactSection
        title={"Kontaktformular"}
        description={"Füllen Sie einfach unser Kontaktformular aus und wir werden uns umgehend mit Ihnen in Verbindung setzen. Oder senden Sie uns eine Nachricht auf kontakt@dreikoenige.berlin"}
      />
    </>
  )
}