Updated a few files

.gitignore

@@ -3,12 +3,14 @@ dist/
 coverage/
 *.log
 .vercel/
-.playwright-cli/
 .DS_Store
-.editorconfig
 serviceAccountKey.json
 firebase-config.js
 .env
 .env.*
 !.env.example
 .firebase/
+.github/prompts/
+./github/copilot-instructions.md/
+.playwright-cli/
+.editorconfig

src/Components/Navbar/Navbar.css

@@ -9,11 +9,11 @@
   border-bottom: 1px solid rgba(59, 130, 246, 0.3);
   z-index: 1000;
   transition: var(--transition);
-  padding: 0.75rem 0;
+  padding: 0.3rem 0;
 }
 
 .navbar.scrolled {
-  padding: 0.5rem 0;
+  padding: 0.1rem 0;
   background: rgba(15, 23, 42, 0.98);
   box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
 }

src/Pages/Contact/Contact.css

@@ -1,30 +1,34 @@
 /* Contact Section */
 .contact {
-  padding: 120px 0;
+  padding: 92px 0 58px;
   background: rgba(255, 255, 255, 0.9);
   position: relative;
   z-index: 1;
 }
 
+.contact .section-title {
+  margin-bottom: 2.75rem;
+}
+
 .contact-grid {
   display: grid;
   grid-template-columns: 1fr 1.5fr;
   gap: 4rem;
-  margin-top: 3rem;
+  margin-top: 0;
   align-items: start;
 }
 
 .contact-intro {
   color: var(--text-secondary);
   line-height: 1.7;
-  margin-bottom: 2rem;
+  margin-bottom: 1.25rem;
   font-size: 1.05rem;
 }
 
 .contact-links {
   display: flex;
   flex-direction: column;
-  gap: 1rem;
+  gap: 0.75rem;
 }
 
 .contact-link {
@@ -34,7 +38,7 @@
   color: var(--text-primary);
   text-decoration: none;
   font-weight: 500;
-  padding: 0.75rem 1rem;
+  padding: 0.65rem 0.95rem;
   border-radius: 0.75rem;
   border: 1px solid var(--border-color);
   background: white;
@@ -67,13 +71,13 @@
 .contact-form {
   display: flex;
   flex-direction: column;
-  gap: 1.25rem;
+  gap: 1rem;
 }
 
 .form-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
-  gap: 1.25rem;
+  gap: 1rem;
 }
 
 .form-group {
@@ -101,6 +105,10 @@
   resize: vertical;
 }
 
+.form-group textarea {
+  min-height: 132px;
+}
+
 .form-group input:focus,
 .form-group textarea:focus {
   outline: none;

src/Pages/Contact/Contact.jsx

@@ -126,7 +126,7 @@ export default function Contact() {
                 value={form.message}
                 onChange={handleChange}
                 placeholder="Your message..."
-                rows={6}
+                rows={5}
                 required
               />
             </div>

src/Pages/Footer/Footer.css

@@ -2,44 +2,47 @@
 .footer {
   background: var(--primary-dark);
   color: white;
-  padding: 3rem 0 2rem;
+  padding: 2rem 0 1.5rem;
   position: relative;
   z-index: 1;
 }
 
 .footer-inner {
-  display: flex;
-  flex-direction: column;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto auto;
   align-items: center;
-  gap: 1.5rem;
-  text-align: center;
+  gap: 0.9rem 1.2rem;
+  text-align: left;
 }
 
 .footer-brand {
   display: flex;
   flex-direction: column;
-  gap: 0.25rem;
+  gap: 0.3rem;
 }
 
 .footer-name {
-  font-size: 1.25rem;
+  font-size: 1.5rem;
+  line-height: 1.15;
   font-weight: 700;
   color: white;
 }
 
 .footer-role {
-  font-size: 0.9rem;
+  font-size: 1rem;
+  line-height: 1.3;
   color: rgba(255, 255, 255, 0.6);
 }
 
 .footer-socials {
   display: flex;
-  gap: 1rem;
+  gap: 0.65rem;
+  justify-content: center;
 }
 
 .footer-social-link {
-  width: 40px;
-  height: 40px;
+  width: 34px;
+  height: 34px;
   border-radius: 50%;
   border: 1px solid rgba(255, 255, 255, 0.2);
   display: flex;
@@ -51,8 +54,8 @@
 }
 
 .footer-social-link svg {
-  width: 18px;
-  height: 18px;
+  width: 16px;
+  height: 16px;
 }
 
 .footer-social-link:hover {
@@ -63,7 +66,32 @@
 }
 
 .footer-copy {
-  font-size: 0.85rem;
+  font-size: 1rem;
+  justify-self: end;
+  text-align: right;
   color: rgba(255, 255, 255, 0.4);
   margin: 0;
+  white-space: nowrap;
+}
+
+@media (max-width: 900px) {
+  .footer {
+    padding: 1.5rem 0 1.05rem;
+  }
+
+  .footer-inner {
+    grid-template-columns: 1fr;
+    gap: 0.8rem;
+    text-align: center;
+  }
+
+  .footer-brand {
+    align-items: center;
+  }
+
+  .footer-copy {
+    justify-self: center;
+    text-align: center;
+    white-space: normal;
+  }
 }

src/Pages/Footer/Footer.jsx

@@ -27,7 +27,7 @@ const SOCIAL_LINKS = [
 export default function Footer() {
   const year = new Date().getFullYear();
   return (
-    <footer className="footer">
+    <footer id="footer" className="footer">
       <div className="container footer-inner">
         <div className="footer-brand">
           <span className="footer-name">Agoma Divine E.</span>

src/utils/scrollToSection.js

@@ -56,10 +56,23 @@ export function scrollToSectionById(sectionId, options = {}) {
     return false;
   }
 
-  const targetTop = window.scrollY + section.getBoundingClientRect().top - getNavbarClearance(options);
+  let targetTop = window.scrollY + section.getBoundingClientRect().top - getNavbarClearance(options);
+
+  if (normalizedSectionId === 'contact') {
+    const footer = document.getElementById('footer');
+
+    if (footer) {
+      const footerBottom = window.scrollY + footer.getBoundingClientRect().bottom;
+      const footerAlignedTop = footerBottom - window.innerHeight;
+      targetTop = Math.max(targetTop, footerAlignedTop);
+    }
+  }
+
+  const maxScrollTop = Math.max(0, document.documentElement.scrollHeight - window.innerHeight);
+  const clampedTop = Math.min(Math.max(0, targetTop), maxScrollTop);
 
   window.scrollTo({
-    top: Math.max(0, targetTop),
+    top: clampedTop,
     behavior,
   });