refactor: improve responsive

Author: francescarpi

src/components/home/SectionSponsors.astro

@@ -31,7 +31,7 @@ const main = filterSponsorsByTier('main')
   <SectionTitle title={t['sponsors.title']} />
   <TextBox text={t['sponsors.description']} />
 
-  <div class="flex flex-col w-full gap-8">
+  <div class="w-full grid grid-cols-1 gap-8 lg:grid-cols-2">
     <SponsorsGroup lang={lang} title={t['sponsors.main']} sponsors={main} tierId="main" />
     <SponsorsGroup lang={lang} title={t['sponsors.platinum']} sponsors={platinum} tierId="platinum" />
     <SponsorsGroup lang={lang} title={t['sponsors.gold']} sponsors={gold} tierId="gold" />

src/components/home/sponsors/SponsorsGroup.astro

@@ -24,7 +24,7 @@ const IMG_WITH_BY_TIER: Record<TSponsorTier, number> = {
 ---
 
 <div>
-  <h4 style={`background-color: ${hexToRgba(TIER_COLORS[tierId], 0.2)};`} class="p-2">{title}</h4>
+  <h4 style={`background-color: ${hexToRgba(TIER_COLORS[tierId], 0.4)};`} class="p-2">{title}</h4>
   {
     sponsors.length > 0 ? (
       <div class="flex flex-wrap gap-4 mt-4">