feat: ✨ enable flex wrap

use relative imports for components

src/app/(frontend)/[locale]/contact/page.tsx

@@ -1,12 +1,10 @@
 import { Box, HStack, Stack } from "@styled-system/jsx";
 import { getAbout, getContact } from "@/api";
 
-import ContactForm from "@/app/(frontend)/[locale]/contact/contact-form";
-import { Field } from "@/components/ui/field";
+import ContactForm from "./contact-form";
 import { Heading } from "@/components/ui/heading";
-import { Input } from "@/components/ui/input";
 import { Params } from "../shared";
-import ReservationForm from "@/app/(frontend)/[locale]/contact/reservation-form";
+import ReservationForm from "./reservation-form";
 import { Tabs } from "@/components/ui/tabs";
 import { Text } from "@/components/ui/text";
 import { getI18n } from "@/i18n/server";
@@ -69,7 +67,7 @@ export default async function Contact({ params: { locale } }: { params: Params }
             <Heading as="h3" size="xl">
               {t("general.address")}
             </Heading>
-            <HStack gap={20}>
+            <HStack gap={20} flexWrap="wrap">
               {contact.address.embeddedMaps && (
                 <styled.div
                   dangerouslySetInnerHTML={{ __html: contact.address.embeddedMaps }}