From 50b14ced2132da154abf885113e0ce8122bb2819 Mon Sep 17 00:00:00 2001
From: Albert <albert.gadea@gmail.com>
Date: Wed, 17 Jun 2026 15:20:59 +0200
Subject: [PATCH] ui: clean footer - single sponsors section, white pills,
 correct links

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/components/Footer.tsx | 135 +++++++++++++++-----------------------
 1 file changed, 52 insertions(+), 83 deletions(-)

diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 0f0248e..2b5e076 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,102 +1,70 @@
 import Image from 'next/image'
-import { Instagram, Globe } from 'lucide-react'
 
 export default function Footer() {
   return (
     <footer className="border-t border-dark-border bg-dark">
-      {/* Sponsors */}
-      <div className="max-w-6xl mx-auto px-4 sm:px-6 py-12">
-        <p className="text-xs font-semibold uppercase tracking-[0.3em] text-slate-600 text-center mb-10">
-          Amb el suport de
-        </p>
 
-        {/* Patrocinador principal */}
-        <div className="flex flex-col items-center mb-8">
-          <span className="text-[10px] text-slate-600 uppercase tracking-widest mb-4">Patrocinador principal</span>
+      {/* ── Patrocinadors ───────────────────────────────────── */}
+      <div className="max-w-4xl mx-auto px-4 sm:px-6 py-14">
+
+        {/* Principal */}
+        <p className="text-[10px] uppercase tracking-[0.25em] text-slate-600 text-center mb-5">
+          Patrocinador principal
+        </p>
+        <div className="flex justify-center mb-12">
           <a
-            href="https://www.finquesprats.com"
+            href="https://www.instagram.com/finquesprats/"
             target="_blank"
             rel="noopener noreferrer"
-            className="group flex flex-col items-center gap-3"
+            style={{ background: '#ffffff', borderRadius: '16px', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '16px 32px', boxShadow: '0 2px 8px rgba(0,0,0,0.15)' }}
           >
-            <div className="bg-white rounded-2xl px-8 py-5 shadow-sm group-hover:shadow-md transition-shadow flex items-center justify-center" style={{minWidth: '200px', minHeight: '90px'}}>
-              <Image
-                src="/assets/Finques Prats Logo.png"
-                alt="Finques Prats"
-                width={180}
-                height={70}
-                className="object-contain"
-              />
-            </div>
-            <div className="flex items-center gap-2">
-              <a href="https://www.instagram.com/finquesprats/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Instagram Finques Prats">
-                <Instagram size={15} />
-              </a>
-            </div>
+            <Image
+              src="/assets/Finques Prats Logo.png"
+              alt="Finques Prats"
+              width={180}
+              height={65}
+              style={{ objectFit: 'contain' }}
+            />
           </a>
         </div>
 
-        {/* Col·laboradors */}
-        <div className="flex flex-col items-center">
-          <span className="text-[10px] text-slate-600 uppercase tracking-widest mb-4">Col·laboradors</span>
-          <div className="flex flex-wrap justify-center items-start gap-8">
-
-            {/* Corbins Runners */}
-            <div className="flex flex-col items-center gap-3">
-              <a
-                href="https://cursacorbins.cat/"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="group"
-              >
-                <div className="bg-white rounded-2xl px-6 py-4 shadow-sm group-hover:shadow-md transition-shadow flex items-center justify-center" style={{width: '160px', height: '80px'}}>
-                  <Image
-                    src="/assets/runners-corbins.webp"
-                    alt="Corbins Runners"
-                    width={130}
-                    height={65}
-                    className="object-contain"
-                  />
-                </div>
-              </a>
-              <a href="https://cursacorbins.cat/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Web Corbins Runners">
-                <Globe size={15} />
-              </a>
-            </div>
-
-            {/* Ajuntament de Corbins */}
-            <div className="flex flex-col items-center gap-3">
-              <a
-                href="https://www.corbins.cat"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="group"
-              >
-                <div className="bg-white rounded-2xl px-5 py-4 shadow-sm group-hover:shadow-md transition-shadow flex items-center justify-center" style={{width: '160px', height: '80px'}}>
-                  <Image
-                    src="/assets/ajuntament-de-corbins.webp"
-                    alt="Ajuntament de Corbins"
-                    width={110}
-                    height={60}
-                    className="object-contain"
-                  />
-                </div>
-              </a>
-              <div className="flex items-center gap-3">
-                <a href="https://www.instagram.com/viu_corbins/" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Instagram Ajuntament">
-                  <Instagram size={15} />
-                </a>
-                <a href="https://www.corbins.cat" target="_blank" rel="noopener noreferrer" className="text-slate-600 hover:text-teal transition-colors" aria-label="Web Ajuntament de Corbins">
-                  <Globe size={15} />
-                </a>
-              </div>
-            </div>
-
-          </div>
+        {/* Organitzadors */}
+        <p className="text-[10px] uppercase tracking-[0.25em] text-slate-600 text-center mb-5">
+          Organitzadors
+        </p>
+        <div className="flex flex-wrap justify-center items-center gap-6">
+          <a
+            href="https://cursacorbins.cat/"
+            target="_blank"
+            rel="noopener noreferrer"
+            style={{ background: '#ffffff', borderRadius: '16px', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '14px 24px', boxShadow: '0 2px 8px rgba(0,0,0,0.15)', width: '170px', height: '80px' }}
+          >
+            <Image
+              src="/assets/runners-corbins.webp"
+              alt="Corbins Runners"
+              width={130}
+              height={60}
+              style={{ objectFit: 'contain' }}
+            />
+          </a>
+          <a
+            href="https://www.instagram.com/viu_corbins/"
+            target="_blank"
+            rel="noopener noreferrer"
+            style={{ background: '#ffffff', borderRadius: '16px', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: '14px 24px', boxShadow: '0 2px 8px rgba(0,0,0,0.15)', width: '170px', height: '80px' }}
+          >
+            <Image
+              src="/assets/ajuntament-de-corbins.webp"
+              alt="Ajuntament de Corbins"
+              width={110}
+              height={60}
+              style={{ objectFit: 'contain' }}
+            />
+          </a>
         </div>
       </div>
 
-      {/* Bottom bar */}
+      {/* ── Bottom bar ──────────────────────────────────────── */}
       <div className="border-t border-dark-border/50 py-6">
         <div className="max-w-6xl mx-auto px-4 sm:px-6 flex flex-col sm:flex-row items-center justify-between gap-3 text-center sm:text-left">
           <div className="flex items-center gap-2">
@@ -118,6 +86,7 @@ export default function Footer() {
           </div>
         </div>
       </div>
+
     </footer>
   )
 }