From 0bcaf9a7cfd03abb47cb1e6915d31cc5b1d974a3 Mon Sep 17 00:00:00 2001
From: d4rm5 <dante@theredguild.org>
Date: Fri, 10 Apr 2026 20:11:31 -0300
Subject: [PATCH 1/4] Fix excessive padding on large screens in front page

Remove max-w-6xl/mx-auto that caused huge auto-margins on wide viewports;
replace with responsive px that scales from mobile to xl.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/[locale]/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index f4282c8..1b797e7 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -70,7 +70,7 @@ export default function LandingPage() {
         <div className="absolute inset-0 bg-[radial-gradient(circle_at_top,rgba(164,114,255,0.18),transparent_28%),linear-gradient(180deg,rgba(12,11,20,0.96),rgba(9,9,16,1))]" />
         <div className="absolute inset-0 bg-[linear-gradient(to_right,rgba(164,114,255,0.05)_1px,transparent_1px),linear-gradient(to_bottom,rgba(34,211,238,0.04)_1px,transparent_1px)] bg-[size:48px_48px] opacity-20" />
 
-        <div className="relative mx-auto w-full max-w-6xl px-6 py-8 sm:px-10">
+        <div className="relative w-full px-6 py-8 sm:px-10 lg:px-14 xl:px-20">
           <div className="grid w-full grid-cols-1 items-start gap-10 lg:grid-cols-[1fr_3fr_1fr]">
 
             {/* Capítulos pasados */}

From 5ce01f7e449b9575e70131de18b6309e7a26d432 Mon Sep 17 00:00:00 2001
From: d4rm5 <dante@theredguild.org>
Date: Fri, 10 Apr 2026 20:21:19 -0300
Subject: [PATCH 2/4] Remove right margin on large screens and style Luma
 button

Asymmetric padding on lg/xl keeps left breathing room but flushes content
right. Luma CTA now matches Discord button shape with grey styling.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/[locale]/page.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index 1b797e7..8288d89 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -70,7 +70,7 @@ export default function LandingPage() {
         <div className="absolute inset-0 bg-[radial-gradient(circle_at_top,rgba(164,114,255,0.18),transparent_28%),linear-gradient(180deg,rgba(12,11,20,0.96),rgba(9,9,16,1))]" />
         <div className="absolute inset-0 bg-[linear-gradient(to_right,rgba(164,114,255,0.05)_1px,transparent_1px),linear-gradient(to_bottom,rgba(34,211,238,0.04)_1px,transparent_1px)] bg-[size:48px_48px] opacity-20" />
 
-        <div className="relative w-full px-6 py-8 sm:px-10 lg:px-14 xl:px-20">
+        <div className="relative w-full py-8 px-6 sm:px-10 lg:pl-14 lg:pr-6 xl:pl-20 xl:pr-0">
           <div className="grid w-full grid-cols-1 items-start gap-10 lg:grid-cols-[1fr_3fr_1fr]">
 
             {/* Capítulos pasados */}
@@ -167,10 +167,10 @@ export default function LandingPage() {
                       href={LUMA_URL}
                       target="_blank"
                       rel="noopener noreferrer"
-                      className="inline-flex w-fit items-center gap-1.5 text-sm text-muted-foreground transition hover:text-foreground"
+                      className="inline-flex w-fit items-center gap-2 rounded-lg border border-white/20 bg-white/5 px-4 py-2 text-sm font-medium text-muted-foreground transition hover:border-white/40 hover:bg-white/10 hover:text-foreground"
                     >
                       {t('landing.frontPage.cta.lumaCta')}
-                      <ExternalLink className="size-3" />
+                      <ExternalLink className="size-3.5" />
                     </a>
                   </div>
                 </div>

From 006ef8d42926568d125da423f0cf98d982685540 Mon Sep 17 00:00:00 2001
From: d4rm5 <dante@theredguild.org>
Date: Fri, 10 Apr 2026 20:48:55 -0300
Subject: [PATCH 3/4] Balance front page layout: symmetric padding, larger side
 columns, and right-aligned contributors

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 app/[locale]/page.tsx | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index 8288d89..a3a3a83 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -70,25 +70,25 @@ export default function LandingPage() {
         <div className="absolute inset-0 bg-[radial-gradient(circle_at_top,rgba(164,114,255,0.18),transparent_28%),linear-gradient(180deg,rgba(12,11,20,0.96),rgba(9,9,16,1))]" />
         <div className="absolute inset-0 bg-[linear-gradient(to_right,rgba(164,114,255,0.05)_1px,transparent_1px),linear-gradient(to_bottom,rgba(34,211,238,0.04)_1px,transparent_1px)] bg-[size:48px_48px] opacity-20" />
 
-        <div className="relative w-full py-8 px-6 sm:px-10 lg:pl-14 lg:pr-6 xl:pl-20 xl:pr-0">
-          <div className="grid w-full grid-cols-1 items-start gap-10 lg:grid-cols-[1fr_3fr_1fr]">
+        <div className="relative w-full px-6 py-8 sm:px-8 lg:px-12">
+          <div className="grid w-full grid-cols-1 items-start gap-8 lg:grid-cols-[1fr_2.5fr_1fr]">
 
             {/* Capítulos pasados */}
             {PAST_CHAPTERS.length > 0 && (
               <div>
-                <p className="mb-3 font-mono text-xs uppercase tracking-[0.3em] text-primary/70">
+                <p className="mb-4 font-mono text-sm uppercase tracking-[0.3em] text-primary/70">
                   {t('landing.frontPage.sections.past.kicker')}
                 </p>
                 {PAST_CHAPTERS.map((chapter) => (
-                  <div key={chapter.slug} className="border-l-2 border-white/10 py-2 pl-4">
-                    <div className="flex flex-col gap-1">
-                      <span className="text-sm font-medium text-foreground">
+                  <div key={chapter.slug} className="border-l-2 border-white/10 py-3 pl-4">
+                    <div className="flex flex-col gap-1.5">
+                      <span className="text-base font-medium text-foreground">
                         {t('landing.frontPage.sections.past.chapterLabel', { number: chapter.number })}
                       </span>
-                      <span className="text-xs text-muted-foreground/60">
+                      <span className="text-sm text-muted-foreground/60">
                         {t(`landing.frontPage.chapters.${chapter.slug}.name`)}
                       </span>
-                      <div className="flex gap-3 pt-1">
+                      <div className="flex flex-wrap gap-2 pt-1.5">
                         <a href={chapter.chapterUrl} target="_blank" rel="noopener noreferrer" title="Open chapter" className="rounded-md border border-white/10 px-2 py-0.5 text-sm text-muted-foreground transition hover:border-primary/40 hover:text-primary">
                           {t('landing.frontPage.sections.past.webCta')}
                         </a>
@@ -191,11 +191,11 @@ export default function LandingPage() {
             </div>
 
             {/* Contribuidores */}
-            <div>
-              <p className="mb-3 font-mono text-xs uppercase tracking-[0.3em] text-primary/70">
+            <div className="lg:text-right">
+              <p className="mb-4 font-mono text-sm uppercase tracking-[0.3em] text-primary/70">
                 {t('landing.frontPage.contributors.kicker')}
               </p>
-              <div className="flex flex-col gap-3">
+              <div className="flex flex-col gap-4 lg:items-end">
                 {[
                   { handle: 'd4rm_', name: 'dantesito', url: 'https://x.com/d4rm_' },
                   { handle: 'mattaereal', name: 'matta', url: 'https://x.com/mattaereal' },
@@ -205,18 +205,18 @@ export default function LandingPage() {
                     href={contributor.url}
                     target="_blank"
                     rel="noopener noreferrer"
-                    className="group flex items-center gap-2.5 transition"
+                    className="group flex items-center gap-3 transition lg:flex-row-reverse"
                   >
-                    <Avatar className="size-7 ring-1 ring-white/10 transition group-hover:ring-primary/40">
+                    <Avatar className="size-9 ring-1 ring-white/10 transition group-hover:ring-primary/40">
                       <AvatarImage
                         src={`https://unavatar.io/twitter/${contributor.handle}`}
                         alt={contributor.name}
                       />
-                      <AvatarFallback className="text-[10px] text-muted-foreground">
+                      <AvatarFallback className="text-xs text-muted-foreground">
                         {contributor.name[0].toUpperCase()}
                       </AvatarFallback>
                     </Avatar>
-                    <span className="text-sm text-muted-foreground transition group-hover:text-foreground">
+                    <span className="text-base text-muted-foreground transition group-hover:text-foreground">
                       {contributor.name}
                     </span>
                   </a>

From 2ac13a1ea84e3155669f7e49e73366ab499baf65 Mon Sep 17 00:00:00 2001
From: d4rm5 <dante@theredguild.org>
Date: Fri, 10 Apr 2026 21:06:54 -0300
Subject: [PATCH 4/4] Add intro video embed, introduction entry in past
 sessions, and inline CTA buttons

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 app/[locale]/page.tsx | 46 +++++++++++++++++++++++++++++++------------
 messages/en.json      |  4 ++++
 messages/es.json      |  4 ++++
 3 files changed, 41 insertions(+), 13 deletions(-)

diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index a3a3a83..a79db1b 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -14,10 +14,11 @@ const DISCORD_INVITE_URL = 'https://discord.com/invite/eegRCDmwbM';
 const CHAPTER_1_NOTES_URL = '/notes/chapter-1';
 const CHAPTER_1_SLIDES_URL =
   'https://drive.google.com/file/d/1kZLWj9N8C96wh-Ow2iV1D-Q9G_IU_4CU/view?usp=drive_link';
+const INTRO_YOUTUBE_URL = 'https://www.youtube.com/watch?v=67zwkh_cC6Q';
 const CHAPTER_1_YOUTUBE_URL =
   'https://www.youtube.com/playlist?list=PLvTXryB-aeclKsDmbPj3WKPdtBmZ5_xZX';
-const PLAYLIST_EMBED_URL =
-  'https://www.youtube.com/embed/videoseries?list=PLvTXryB-aeclKsDmbPj3WKPdtBmZ5_xZX';
+const INTRO_VIDEO_EMBED_URL =
+  'https://www.youtube.com/embed/67zwkh_cC6Q?list=PLvTXryB-aeclKsDmbPj3WKPdtBmZ5_xZX';
 
 const PAST_CHAPTERS = [
   {
@@ -79,6 +80,21 @@ export default function LandingPage() {
                 <p className="mb-4 font-mono text-sm uppercase tracking-[0.3em] text-primary/70">
                   {t('landing.frontPage.sections.past.kicker')}
                 </p>
+                <div className="border-l-2 border-white/10 py-3 pl-4">
+                  <div className="flex flex-col gap-1.5">
+                    <span className="text-base font-medium text-foreground">
+                      {t('landing.frontPage.chapters.introduction.title')}
+                    </span>
+                    <span className="text-sm text-muted-foreground/60">
+                      {t('landing.frontPage.chapters.introduction.name')}
+                    </span>
+                    <div className="flex flex-wrap gap-2 pt-1.5">
+                      <a href={INTRO_YOUTUBE_URL} target="_blank" rel="noopener noreferrer" title="Watch introduction" className="rounded-md border border-white/10 px-2 py-0.5 text-sm text-muted-foreground transition hover:border-primary/40 hover:text-primary">
+                        {t('landing.frontPage.sections.past.playlistCta')}
+                      </a>
+                    </div>
+                  </div>
+                </div>
                 {PAST_CHAPTERS.map((chapter) => (
                   <div key={chapter.slug} className="border-l-2 border-white/10 py-3 pl-4">
                     <div className="flex flex-col gap-1.5">
@@ -139,8 +155,21 @@ export default function LandingPage() {
                 </p>
               </div>
 
+              {/* Intro video */}
+              <div className="overflow-hidden rounded-xl border border-white/8">
+                <div className="relative aspect-video">
+                  <iframe
+                    src={INTRO_VIDEO_EMBED_URL}
+                    title={t('landing.frontPage.introVideo')}
+                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                    allowFullScreen
+                    className="absolute inset-0 h-full w-full"
+                  />
+                </div>
+              </div>
+
               {/* CTA card */}
-              <div className="grid overflow-hidden rounded-xl border border-white/8 bg-white/[0.03] grid-cols-1 sm:grid-cols-[1fr_240px]">
+              <div className="overflow-hidden rounded-xl border border-white/8 bg-white/[0.03]">
                 <div className="flex flex-col justify-between gap-4 p-5">
                   <div className="flex flex-col gap-2">
                     <div className="flex items-center gap-2">
@@ -153,7 +182,7 @@ export default function LandingPage() {
                       {t('landing.frontPage.cta.description')}
                     </p>
                   </div>
-                  <div className="flex flex-col gap-2">
+                  <div className="flex flex-wrap gap-2">
                     <a
                       href={DISCORD_INVITE_URL}
                       target="_blank"
@@ -174,15 +203,6 @@ export default function LandingPage() {
                     </a>
                   </div>
                 </div>
-                <div className="hidden overflow-hidden sm:block">
-                  <iframe
-                    src={PLAYLIST_EMBED_URL}
-                    title={t('landing.frontPage.sections.past.embedTitle')}
-                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-                    allowFullScreen
-                    className="h-full w-full"
-                  />
-                </div>
               </div>
 
               <footer className="text-xs text-muted-foreground">
diff --git a/messages/en.json b/messages/en.json
index 8a514a7..22d4b7c 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -528,6 +528,10 @@
         }
       },
       "chapters": {
+        "introduction": {
+          "title": "Introduction",
+          "name": "Study group presentation"
+        },
         "chapter-1": {
           "title": "Chapter 1",
           "name": "What is Ethereum?"
diff --git a/messages/es.json b/messages/es.json
index 0d6da0d..22865a2 100644
--- a/messages/es.json
+++ b/messages/es.json
@@ -528,6 +528,10 @@
         }
       },
       "chapters": {
+        "introduction": {
+          "title": "Introducción",
+          "name": "Presentación del grupo de estudio"
+        },
         "chapter-1": {
           "title": "Capítulo 1",
           "name": "¿Qué es Ethereum?"