move logo and contact in footer

css/styles.css

@@ -652,6 +652,56 @@ img {
     color: #444;
 }
 
+.footer-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 40px;
+    padding-bottom: 30px;
+    border-bottom: 1px solid #e0e0e0;
+    max-width: 1200px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.footer-logo {
+    margin: 0;
+}
+
+.footer-logo img {
+    height: 90px;
+    transition: transform 0.3s;
+}
+
+.footer-logo img:hover {
+    transform: scale(1.05);
+}
+
+.footer-contact-info {
+    text-align: right;
+}
+
+.footer-contact {
+    font-size: 18px;
+    font-weight: 600;
+    margin-bottom: 10px;
+    color: #333;
+}
+
+.footer-email {
+    font-size: 16px;
+}
+
+.footer-email a {
+    color: #555;
+    text-decoration: none;
+    transition: color 0.2s;
+}
+
+.footer-email a:hover {
+    color: var(--primary-red);
+}
+
 .footer-columns {
     display: flex;
     flex-wrap: wrap;
@@ -670,12 +720,6 @@ img {
     margin-bottom: 30px;
 }
 
-.footer-column:first-child {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-start;
-}
-
 .footer-title {
     font-size: 18px;
     font-weight: 700;
@@ -744,20 +788,6 @@ img {
     opacity: 0.8;
 }
 
-.footer-logo {
-    margin-bottom: 25px;
-    align-self: flex-start;
-}
-
-.footer-logo img {
-    height: 90px;
-    transition: transform 0.3s;
-}
-
-.footer-logo img:hover {
-    transform: scale(1.05);
-}
-
 .footer-social {
     display: flex;
     justify-content: center;
@@ -785,22 +815,6 @@ img {
     box-shadow: 0 5px 15px rgba(0,0,0,0.1);
 }
 
-.footer-email {
-    font-size: 16px;
-    align-self: flex-start;
-    margin-bottom: 5px;
-}
-
-.footer-email a {
-    color: #555;
-    text-decoration: none;
-    transition: color 0.2s;
-}
-
-.footer-email a:hover {
-    color: var(--primary-red);
-}
-
 @media (max-width: 1000px) {
     .footer {
         margin-left: 0;
@@ -808,6 +822,21 @@ img {
         padding: 40px 20px 20px;
     }
     
+    .footer-header {
+        flex-direction: column;
+        text-align: center;
+        margin-bottom: 30px;
+        padding-bottom: 20px;
+    }
+    
+    .footer-logo {
+        margin-bottom: 20px;
+    }
+    
+    .footer-contact-info {
+        text-align: center;
+    }
+    
     .footer-columns {
         flex-direction: column;
         align-items: center;
@@ -820,10 +849,6 @@ img {
         max-width: 400px;
     }
     
-    .footer-column:first-child {
-        align-items: center;
-    }
-    
     .footer-title::after {
         left: 50%;
         transform: translateX(-50%);

includes/footer.php

@@ -1,14 +1,17 @@
 <!-- Footer -->
 <div class="footer">
-    <div class="footer-columns">
-        <div class="footer-column">
+    <div class="footer-header">
         <div class="footer-logo">
             <img src="img/logo.png" alt="Kaubuntu.re">
         </div>
         
-            <div class="footer-email"><a href="mailto:<?php echo CONTACT_EMAIL; ?>"><strong><?php echo CONTACT_EMAIL; ?></strong></a></div>
+        <div class="footer-contact-info">
+            <div class="footer-contact">CONTACT</div>
+            <div class="footer-email"><a href="mailto:<?php echo LEGAL_CONTACT_EMAIL; ?>"><?php echo LEGAL_CONTACT_EMAIL; ?></a></div>
+        </div>
     </div>
 
+    <div class="footer-columns">
         <div class="footer-column">
             <h3 class="footer-title">Catégories</h3>
             <ul class="footer-links">