fix hero-img + add section

src/layout/UiFooter/UiFooter.vue

@@ -1,7 +1,7 @@
 <template>
   <footer class="mx-auto container">
-    <div class="relative z-10">
-      <div class="flex flex-wrap space-x-[51px] mb-5">
+    <div class="relative z-10 max-w-[1280px] mx-auto">
+      <div class="flex space-x-5 xl:space-x-[51px] mb-5">
         <UiNav :nav-content="footerNavigation" />
       </div>
       <div class="xl:max-w-[1225px] pb-7 flex justify-between">

src/layout/UiHeader/UiHeader.vue

@@ -1,6 +1,6 @@
 <template>
   <header class="py-4 container mx-auto">
-    <div class="flex flex-row-reverse justify-end gap-4 items-center">
+    <div class="flex flex-row-reverse justify-end gap-4 items-center max-w-[1280px] mx-auto">
       <slot name="content" />
       <div class="flex items-center gap-32">
         <div class="russo-one-regular cursor-pointer !text-primary">

src/layout/UiLayout.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="min-h-svh bg-black-50 lato-regular relative overflow-visible before:content-[''] before:absolute before:bottom-0 before:h-[520px] before:w-full before:bg-[url(/src/assets/img/webp/footer-flowers.webp)] before:bg-no-repeat before:bg-bottom before:bg-cover before:z-0"
+    class="min-h-svh overflow-x-hidden bg-black-50 lato-regular relative overflow-visible before:content-[''] before:absolute before:bottom-0 before:h-[520px] before:w-full before:bg-[url(/src/assets/img/webp/footer-flowers.webp)] before:bg-no-repeat before:bg-bottom before:bg-cover before:z-0"
   >
     <div
       class="relative z-10 after:content-[''] after:absolute after:top-0 after:right-0 after:w-[820px] after:h-[535px] after:bg-[url(/src/assets/img/webp/gradient.webp)] after:bg-no-repeat after:bg-[right_top] after:bg-contain after:pointer-events-none"