From 874c85472d9e4ae1c8cc8a434611323e5a6cdbdf Mon Sep 17 00:00:00 2001
From: Antoine M <martinon.toinou@protonmail.com>
Date: Tue, 3 Jun 2025 10:35:40 +0200
Subject: [PATCH] STYLE enhance footer layout and responsiveness with updated
 spacing and image handling

---
 resources/css/layout/footer.css | 30 +++++++++++++++++++++++++-----
 1 file changed, 25 insertions(+), 5 deletions(-)

diff --git a/resources/css/layout/footer.css b/resources/css/layout/footer.css
index 31127bd..f3622df 100644
--- a/resources/css/layout/footer.css
+++ b/resources/css/layout/footer.css
@@ -1,7 +1,7 @@
 footer {
-  @apply mx-auto px-12;
+  @apply w-full mx-auto px-12;
   .branding {
-    @apply w-full mb-12 grid relative  pt-64;
+    @apply w-full mb-12 grid relative mt-24 md:mt-32 xl:mt-48;
     z-index: -1;
     .square,
     .rectangle-rotated {
@@ -17,12 +17,32 @@ footer {
     }
 
     &__shapes {
-      @apply w-full grid gap-4 grid-cols-4  h-full absolute  left-0;
+      @apply w-full max-w-full grid gap-2 md:gap-24 xl:gap-32 2xl:gap-48 grid-cols-4 h-full absolute left-0;
       top: 0px;
 
-      img {
-        @apply h-64 shrink;
+      div.shape {
+        @apply shrink flex flex-col w-full h-full;
+        /* background-color: rgba(219, 234, 254, 0.5); */
+        top: 0;
         flex-shrink: 1;
+        aspect-ratio: 1/1;
+        justify-self: center;
+        transform-origin: bottom center;
+        position: relative;
+        bottom: 0;
+      }
+      div.square:first-child,
+      div.rectangle-rotated {
+        @apply justify-end;
+      }
+      img {
+        @apply w-full h-fit object-contain;
+        aspect-ratio: 1/1;
+        flex-grow: 0;
+        width: 100%;
+      }
+      img:last-child {
+        @apply object-right;
       }
     }