diff --git a/!/gemini-jumping.svg b/!/gemini-jumping.svg
new file mode 100644
index 0000000..a1a40c6
--- /dev/null
+++ b/!/gemini-jumping.svg
@@ -0,0 +1,207 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -20 100 120" width="140" height="168">
+  <defs>
+    <!-- 3D enhanced Gemini gradient (lighter top) -->
+    <linearGradient id="gjBodyGrad" x1="0" y1="0" x2="0.3" y2="1">
+      <stop offset="0%" stop-color="#6AA3FF"/>
+      <stop offset="20%" stop-color="#4285F4"/>
+      <stop offset="50%" stop-color="#7B68EE"/>
+      <stop offset="80%" stop-color="#EA4335"/>
+      <stop offset="100%" stop-color="#B82A22"/>
+    </linearGradient>
+
+    <!-- 3D gradient for border -->
+    <linearGradient id="gjBorderGrad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#6AA3FF"/>
+      <stop offset="25%" stop-color="#4285F4"/>
+      <stop offset="50%" stop-color="#9080F0"/>
+      <stop offset="75%" stop-color="#EA4335"/>
+      <stop offset="100%" stop-color="#C03028"/>
+    </linearGradient>
+
+    <!-- Inner panel gradient (dark with depth) -->
+    <linearGradient id="gjInnerGrad" x1="0" y1="0" x2="0.3" y2="1">
+      <stop offset="0%" stop-color="#282840"/>
+      <stop offset="50%" stop-color="#1a1a2e"/>
+      <stop offset="100%" stop-color="#0E0E1A"/>
+    </linearGradient>
+
+    <!-- Arm gradient (3D colorful) -->
+    <linearGradient id="gjArmL" x1="0" y1="0" x2="1" y2="0.5">
+      <stop offset="0%" stop-color="#3570D0"/>
+      <stop offset="50%" stop-color="#5A78E0"/>
+      <stop offset="100%" stop-color="#7B68EE"/>
+    </linearGradient>
+
+    <linearGradient id="gjArmR" x1="0" y1="0" x2="1" y2="0.5">
+      <stop offset="0%" stop-color="#D04535"/>
+      <stop offset="50%" stop-color="#EA4335"/>
+      <stop offset="100%" stop-color="#C03028"/>
+    </linearGradient>
+
+    <!-- Leg gradient -->
+    <linearGradient id="gjLegL" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#4285F4"/>
+      <stop offset="50%" stop-color="#6A58D0"/>
+      <stop offset="100%" stop-color="#5040A0"/>
+    </linearGradient>
+
+    <linearGradient id="gjLegR" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#B84030"/>
+      <stop offset="50%" stop-color="#EA4335"/>
+      <stop offset="100%" stop-color="#D03828"/>
+    </linearGradient>
+
+    <!-- Eye white gradient (glossy) -->
+    <radialGradient id="gjEyeGrad" cx="35%" cy="30%" r="65%">
+      <stop offset="0%" stop-color="#FFFFFF"/>
+      <stop offset="60%" stop-color="#F0F0F0"/>
+      <stop offset="100%" stop-color="#D8D8D8"/>
+    </radialGradient>
+
+    <!-- Chevron 3D gradient -->
+    <linearGradient id="gjChevronGrad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#6AA3FF"/>
+      <stop offset="30%" stop-color="#4285F4"/>
+      <stop offset="60%" stop-color="#9080F0"/>
+      <stop offset="100%" stop-color="#EA4335"/>
+    </linearGradient>
+
+    <!-- Ground shadow radial -->
+    <radialGradient id="gjShadowGrad" cx="50%" cy="50%" r="50%">
+      <stop offset="0%" stop-color="#000" stop-opacity="0.35"/>
+      <stop offset="60%" stop-color="#000" stop-opacity="0.15"/>
+      <stop offset="100%" stop-color="#000" stop-opacity="0"/>
+    </radialGradient>
+
+    <!-- Drop shadow filter -->
+    <filter id="gjDropShadow" x="-15%" y="-15%" width="130%" height="140%">
+      <feDropShadow dx="1.5" dy="2.5" stdDeviation="1.8" flood-color="#000" flood-opacity="0.28"/>
+    </filter>
+
+    <!-- Inner depth for body -->
+    <filter id="gjInnerDepth" x="-5%" y="-5%" width="110%" height="110%">
+      <feGaussianBlur in="SourceAlpha" stdDeviation="1.5" result="blur"/>
+      <feOffset dx="0" dy="1.5" result="off"/>
+      <feFlood flood-color="#000" flood-opacity="0.2" result="color"/>
+      <feComposite in="color" in2="off" operator="in" result="shadow"/>
+      <feMerge>
+        <feMergeNode in="shadow"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+
+    <!-- Chevron glow -->
+    <filter id="gjChevronGlow" x="-15%" y="-15%" width="130%" height="130%">
+      <feGaussianBlur in="SourceGraphic" stdDeviation="1" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+
+  <style>
+    .gemini-body {
+      animation: jump 0.5s ease-in-out infinite;
+      transform-origin: 42px 86px;
+    }
+    .shadow {
+      animation: shadow-scale 0.5s ease-in-out infinite;
+    }
+    .left-arm {
+      animation: wave-left 0.5s ease-in-out infinite;
+      transform-origin: 18px 45px;
+    }
+    .right-arm {
+      animation: wave-right 0.5s ease-in-out infinite;
+      transform-origin: 66px 45px;
+    }
+    .left-leg {
+      animation: leg-bounce 0.5s ease-in-out infinite;
+      transform-origin: 30px 72px;
+    }
+    .right-leg {
+      animation: leg-bounce 0.5s ease-in-out infinite 0.1s;
+      transform-origin: 54px 72px;
+    }
+    @keyframes jump {
+      0%, 100% { transform: translateY(0) scaleY(1) scaleX(1); }
+      30% { transform: translateY(-16px) scaleY(1.1) scaleX(0.95); }
+      50% { transform: translateY(-18px) scaleY(1.05) scaleX(0.98); }
+      80% { transform: translateY(-5px) scaleY(0.95) scaleX(1.05); }
+    }
+    @keyframes shadow-scale {
+      0%, 100% { transform: scaleX(1); opacity: 0.35; }
+      50% { transform: scaleX(0.7); opacity: 0.25; }
+    }
+    @keyframes wave-left {
+      0%, 100% { transform: rotate(0deg); }
+      50% { transform: rotate(-25deg); }
+    }
+    @keyframes wave-right {
+      0%, 100% { transform: rotate(0deg); }
+      50% { transform: rotate(25deg); }
+    }
+    @keyframes leg-bounce {
+      0%, 100% { transform: scaleY(1); }
+      40% { transform: scaleY(1.15); }
+      60% { transform: scaleY(0.88); }
+    }
+  </style>
+
+  <!-- Shadow -->
+  <ellipse class="shadow" cx="42" cy="92" rx="20" ry="4" fill="url(#gjShadowGrad)"/>
+
+  <!-- Gemini Character Group -->
+  <g class="gemini-body" filter="url(#gjDropShadow)">
+    <!-- Left arm -->
+    <rect class="left-arm" x="6" y="42" width="12" height="6" rx="2" fill="url(#gjArmL)"/>
+    <rect class="left-arm" x="7" y="43" width="4" height="2" fill="#8AB8FF" opacity="0.3" rx="0.5"/>
+
+    <!-- Right arm -->
+    <rect class="right-arm" x="66" y="42" width="12" height="6" rx="2" fill="url(#gjArmR)"/>
+    <rect class="right-arm" x="67" y="43" width="4" height="2" fill="#F08070" opacity="0.25" rx="0.5"/>
+
+    <!-- Left leg -->
+    <rect class="left-leg" x="26" y="72" width="8" height="14" rx="2" fill="url(#gjLegL)"/>
+    <rect class="left-leg" x="27" y="73" width="3" height="7" fill="#6AA3FF" opacity="0.3" rx="0.5"/>
+
+    <!-- Right leg -->
+    <rect class="right-leg" x="50" y="72" width="8" height="14" rx="2" fill="url(#gjLegR)"/>
+    <rect class="right-leg" x="51" y="73" width="3" height="7" fill="#F08070" opacity="0.25" rx="0.5"/>
+
+    <!-- Gemini CLI Icon - Rounded rectangle with gradient border -->
+    <g transform="translate(10, 8)" filter="url(#gjInnerDepth)">
+      <!-- Outer gradient border (3D enhanced) -->
+      <rect x="0" y="0" width="64" height="64" rx="14" fill="url(#gjBorderGrad)"/>
+      <!-- Border highlight (top edge shine) -->
+      <rect x="2" y="1" width="40" height="3" rx="2" fill="#8AB8FF" opacity="0.3"/>
+
+      <!-- Inner dark background (3D depth) -->
+      <rect x="5" y="5" width="54" height="54" rx="10" fill="url(#gjInnerGrad)"/>
+      <!-- Inner panel top highlight -->
+      <rect x="8" y="7" width="28" height="4" rx="2" fill="#3A3A58" opacity="0.4"/>
+
+      <!-- Chevron ">" symbol - thick terminal style (3D glow) -->
+      <g transform="translate(14, 16)" filter="url(#gjChevronGlow)">
+        <!-- Top arm of chevron -->
+        <polygon points="0,14 20,0 24,5 10,16" fill="url(#gjChevronGrad)"/>
+        <!-- Bottom arm of chevron -->
+        <polygon points="0,18 10,16 24,27 20,32" fill="url(#gjChevronGrad)"/>
+        <!-- Chevron highlight -->
+        <polygon points="1,14.5 18,2 20,4 9,14" fill="#9CC0FF" opacity="0.25"/>
+      </g>
+    </g>
+
+    <!-- Eyes positioned on the icon - happy bouncing -->
+    <rect x="24" y="28" width="8" height="12" rx="2" fill="url(#gjEyeGrad)"/>
+    <!-- Left eye highlights -->
+    <rect x="25" y="29" width="2.5" height="2.5" fill="#fff" opacity="0.8" rx="0.5"/>
+    <rect x="29" y="35" width="1.2" height="1.2" fill="#fff" opacity="0.35" rx="0.3"/>
+
+    <rect x="44" y="28" width="8" height="12" rx="2" fill="url(#gjEyeGrad)"/>
+    <!-- Right eye highlights -->
+    <rect x="45" y="29" width="2.5" height="2.5" fill="#fff" opacity="0.8" rx="0.5"/>
+    <rect x="49" y="35" width="1.2" height="1.2" fill="#fff" opacity="0.35" rx="0.3"/>
+  </g>
+</svg>
diff --git a/.claude/agents/presentation-learning-journey.md b/.claude/agents/presentation-learning-journey.md
index f51d67c..b16175c 100644
--- a/.claude/agents/presentation-learning-journey.md
+++ b/.claude/agents/presentation-learning-journey.md
@@ -1,6 +1,6 @@
 ---
 name: presentation-learning-journey
-description: PROACTIVELY use this agent whenever the user wants to update, modify, rearrange, or fix the LEARNING-JOURNEY presentation (`presentation/learning-journey/index.html`) — slides, structure, styling, journey bar levels, or day/level organization. Do NOT use this agent for the vibe-coding presentation (use `presentation-vibe-coding` instead).
+description: PROACTIVELY use this agent whenever the user wants to update, modify, rearrange, or fix the LEARNING-JOURNEY presentation (`presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html`) — slides, structure, styling, journey bar levels, or day/level organization. Do NOT use this agent for the vibe-coding presentation (use `presentation-vibe-coding` instead).
 allowedTools:
   - "Bash(*)"
   - "Read"
@@ -19,7 +19,7 @@ color: cyan
 
 # Presentation Learning-Journey Agent
 
-You are a specialized agent for modifying the **Claude Code Learning Journey** presentation at `presentation/learning-journey/index.html`.
+You are a specialized agent for modifying the **Claude Code Learning Journey** presentation at `presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html`.
 
 Scope: this agent ONLY edits the learning-journey presentation. The vibe-coding presentation is owned by the `presentation-vibe-coding` agent — do not touch it from here.
 
@@ -67,7 +67,7 @@ Single-file HTML presentation with inline CSS and JS. Core conventions:
 
 ### Step 1: Read the current state
 
-Before any edit, read `presentation/learning-journey/index.html` and confirm:
+Before any edit, read `presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html` and confirm:
 - Current total slide count
 - Current `data-level` assignments (which slides carry which level)
 - Current TOC `goToSlide(N)` targets on slide 2
@@ -167,3 +167,6 @@ After completing changes, report to the user:
 - **2026-04-19 chip overlap check method**: after any chip insertion, mentally walk each new chip's bounding box against its neighbors — chip height is roughly `padding-top + padding-bottom + font-size * line-height` ≈ 38-46px at 0.9-1.3rem. A 6-9% vertical gap on a 480px min-height container is ~29-43px which is tight but sufficient for same-column chips with different left offsets. If left offsets are within 15% of each other, require at least 8% vertical gap.
 - **2026-04-22 About Me slide (slide 2) insertion — interactive fact-card pattern**: new slide inserted at position 2; all slides 2-39 renumbered to 3-40 (total now 40). Slide 2 has no `data-level` — journey bar shows visible but 0% fill (correct for pre-arc slides, bar is only hidden for slide 1). Interactive elements: circular avatar with `onmouseover` scale+glow effect; three `.fact-card` divs (Role, Education, Repo) using `translateY(-5px)` lift + colored box-shadow on hover; repo card is an `<a>` with `target="_blank" rel="noopener"` opening `https://github.com/shanraisshan/claude-code-best-practice`; star icon uses `animation: pulse-star 2s ease-in-out infinite` keyframe. The `@keyframes pulse-star` was placed in the `<head>` `<style>` block (not inline in the slide div). Image path `../assets/shayan.png` resolves to `presentation/assets/shayan.png` — verified file exists. **Gotcha**: the initial sed renumber pass had a typo that changed slide 33 to 36 instead of 34; fix required a targeted line-number-based `sed -i '' -e '1226s/...'` call before running the 2-32 batch. **Rule**: always verify the sed substitution list before running — check that each `s/"N"/"N+1"/` matches the intended slide, not a mis-typed number.
 - **2026-04-22 About Me slide (slide 2) redesigned — horizontal-to-vertical card rework**: replaced the 3-column horizontal grid with 3 stacked vertical cards (max-width 660px, flex-direction column, gap 16px). Card 1 (Role, blue): flex row with `disrupt-logo.png` (56px contain) + text. Card 2 (Education, purple): two-row logo+text layout inside one card, separated by a thin `border-top: 1px solid #e0d4ec` divider — `uni-fast-logo.png` for Master's (FAST NUCES 2019) and `uni-ned-logo.png` for Bachelor's (NED 2014), both 48px contain. Card 3 (Achievement, amber): flex row with `claude-mascot.svg` (56px contain) + text + inline GitHub badge (`<img src="github.svg" style="filter: invert(1)">` on dark `#24292e` background pill). All 5 logo paths verified against `presentation/assets/logo/`. Hover effects preserved: `translateY(-3px)` lift + colored box-shadow per card. Repo card is `<a href="..." target="_blank" rel="noopener">`. `@keyframes pulse-star` removed from `<style>` block — no longer used (star emoji replaced by claude-mascot.svg). No new CSS classes added — all styling inline. Slide count (40), data-slide numbering, goToSlide targets, and level transitions are untouched.
+- **2026-04-22 asset path reorganization — Shayan personal assets moved to subdirectory**: `presentation/assets/` was reorganized to accommodate a new GDG Kolachi co-presenter deck. Shayan's personal assets are now under `presentation/assets/introduction/Shayan/`. The four updated paths on slide 2 are: `../assets/shayan.png` → `../assets/introduction/Shayan/shayan.png`, `../assets/logo/disrupt-logo.png` → `../assets/introduction/Shayan/disrupt-logo.png`, `../assets/logo/uni-fast-logo.png` → `../assets/introduction/Shayan/uni-fast-logo.png`, `../assets/logo/uni-ned-logo.png` → `../assets/introduction/Shayan/uni-ned-logo.png`. Generic brand assets (`../assets/logo/claude-mascot.svg`) remain at their original paths. **Rule for future edits**: any new slide referencing Shayan's personal photo or logos must use the `../assets/introduction/Shayan/` prefix, not the old `../assets/` or `../assets/logo/` roots.
+- **2026-04-22 deck relocated + GDG Kolachi re-topic of slide 1**: deck moved from `presentation/learning-journey/` to `presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/`. This agent's `description` frontmatter already reflects the new path. Slide 1 was replaced with a conference title slide for GDG Kolachi (Apr 25, 2026). New elements: (1) pill-shaped event badge using `linear-gradient(90deg, #1a73e8 0%, #4285f4 55%, #ea4335 100%)` — GDG blue-to-red — with `border-radius: 999px` and a blue drop-shadow; (2) h1 "Agentic Engineering in the CLI" at 3.2rem with tight letter-spacing; (3) `.subtitle` with inline `<strong style="color:#1a73e8">Claude Code</strong>` and `<em style="color:#ea4335;font-style:normal">Gemini CLI</em>` brand tints; (4) two 140px round avatar cards side-by-side (gap: 72px) for Shayan Rais and Syed Umaid Ahmed — avatar hover uses blue glow for Shayan and red glow for Umaid to mirror the GDG gradient. Umaid's photo resolves at `../assets/introduction/Umaid/umaid.png` (verified). The `../../!/claude-jumping.svg` mascot path resolves correctly from the new deck folder (the `!/` dir is at repo root, two levels up from `presentation/<deck-name>/`) — but the mascot was deliberately dropped because the GDG title slide doesn't need it. Slide count: 40. `data-slide="1"` wrapper unchanged. Slides 2-40 untouched. TOC goToSlide targets: Agents=9, Skills=15, Context=21, CLAUDE.md=26, Commands=32. **Color convention for GDG-brand elements**: use `#1a73e8` (Google blue) and `#ea4335` (Google red) consistently — these are the two poles of the event-badge gradient and the subtitle tints. Do not substitute `#4285f4` (the midpoint blue) for either named role.
+- **2026-04-22 global dual-mascot pattern (Claude top-left, Gemini top-right)**: the deck now renders two persistent corner mascots on every slide via a pair of fixed-position `<div class="header-logo">` elements just before the `.navigation` block. CSS: `.header-logo` is `position: fixed; top: 20px; left: 40px; width: 100px; height: 65px; z-index: 50` (Claude, top-left). `.header-logo.right` adds `left: auto; right: 40px` to flip it to top-right (Gemini). Assets: `../../!/claude-jumping.svg` and `../../!/gemini-jumping.svg` — both verified present at repo root `!/`. The Gemini jumping mascot pairs with the Claude one for the GDG dual-CLI deck. Per-slide mascot `<img>` tags that were hardcoded on slide 1 (with `position: absolute`) are now deleted — use global divs only. The `style="position: relative;"` that was on the slide 1 wrapper was removed because it only existed to anchor those absolute-positioned per-slide mascots. **z-index safety**: mascots at z-index 50 sit below `.journey-bar` (99) and `.navigation` / `.progress` (100) — no overlap. The journey bar is at `right: 62px; top: 95px`, which is far enough below `top: 20px` that the right mascot and the bar track do not visually collide. **Rule**: for any GDG dual-CLI deck, always use this two-div global pattern rather than per-slide mascots — it guarantees consistent placement across all 40 slides without per-slide maintenance.
diff --git a/.claude/rules/presentation.md b/.claude/rules/presentation.md
index 8f25950..c01bc10 100644
--- a/.claude/rules/presentation.md
+++ b/.claude/rules/presentation.md
@@ -12,7 +12,7 @@ Any request to update, modify, or fix a presentation MUST be handled by the matc
 | Presentation | Path | Agent |
 |---|---|---|
 | Vibe Coding → Agentic Engineering | `presentation/vibe-coding-to-agentic-engineering/index.html` | `presentation-vibe-coding` |
-| Claude Code Learning Journey | `presentation/learning-journey/index.html` | `presentation-learning-journey` |
+| Claude Code Learning Journey | `presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html` | `presentation-learning-journey` |
 
 Invoke via the Agent tool:
 
diff --git a/CLAUDE.md b/CLAUDE.md
index 88ee0d0..731f2da 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -31,7 +31,7 @@ Skills in `.claude/skills/<name>/SKILL.md` use YAML frontmatter:
 - `hooks`: Lifecycle hooks scoped to this skill
 
 ### Presentation System
-See `.claude/rules/presentation.md` — presentation work is delegated per-presentation to `presentation-vibe-coding` (for `presentation/vibe-coding-to-agentic-engineering/`) or `presentation-learning-journey` (for `presentation/learning-journey/`).
+See `.claude/rules/presentation.md` — presentation work is delegated per-presentation to `presentation-vibe-coding` (for `presentation/vibe-coding-to-agentic-engineering/`) or `presentation-learning-journey` (for `presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/`).
 
 ### Hooks System
 Cross-platform sound notification system in `.claude/hooks/`:
diff --git a/presentation/learning-journey/index.html b/presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html
similarity index 97%
rename from presentation/learning-journey/index.html
rename to presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html
index 88ea7a5..d142ee6 100644
--- a/presentation/learning-journey/index.html
+++ b/presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html
@@ -75,7 +75,8 @@
         .slide-counter { position: fixed; bottom: 40px; left: 40px; font-size: 0.9rem; color: #999; }
         .keyboard-hint { position: fixed; bottom: 40px; left: 50%; transform: translateX(-50%); font-size: 0.85rem; color: #999; }
         .keyboard-hint kbd { background: #f0f0f0; padding: 4px 8px; border-radius: 4px; border: 1px solid #ddd; font-family: inherit; }
-        .header-logo { position: fixed; top: 20px; right: 40px; width: 100px; height: 65px; z-index: 50; }
+        .header-logo { position: fixed; top: 20px; left: 40px; width: 100px; height: 65px; z-index: 50; }
+        .header-logo.right { left: auto; right: 40px; }
         .header-logo img { width: 100%; height: 100%; }
         .title-logo { width: 200px; height: 130px; margin-bottom: 40px; }
         .title-logo img { width: 100%; height: 100%; }
@@ -139,15 +140,42 @@
     </div>
 
     <!-- ============================================================ -->
-    <!-- SLIDE 1: Title                                                -->
+    <!-- SLIDE 1: GDG Kolachi Conference Title                         -->
     <!-- ============================================================ -->
     <div class="slide active title-slide" data-slide="1">
-        <div class="title-logo">
-            <img src="../../!/claude-jumping.svg" alt="Claude Code mascot jumping" />
-        </div>
-        <h1>Claude Code Learning Journey</h1>
-        <p class="subtitle">There is no one correct way of using Claude Code</p>
-        <p style="margin-top: 60px; font-size: 0.95rem; color: #888;">An onboarding guide for non-engineers &amp; engineers alike.</p>
+
+        <!-- Main title -->
+        <h1 style="font-size: 3.2rem; letter-spacing: -0.02em; margin-bottom: 16px;">Agentic Engineering in the CLI</h1>
+
+        <!-- Subtitle with inline brand logos + gradient text -->
+        <p class="subtitle" style="display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 0;">
+            <span>Lessons from</span>
+            <span style="display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;">
+                <img src="../assets/logo/claude-mascot.svg" alt="Claude" style="height: 28px; width: auto; object-fit: contain; vertical-align: middle;">
+                <strong style="color: #D97757; font-weight: 700;">Claude Code</strong>
+            </span>
+            <span style="color: #999; font-weight: 400;">&mdash; applied to &mdash;</span>
+            <span style="display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;">
+                <img src="../assets/logo/gemini.svg" alt="Gemini" style="height: 28px; width: auto; object-fit: contain; vertical-align: middle;">
+                <strong style="background: linear-gradient(90deg, #1a73e8 0%, #4285f4 55%, #ea4335 100%); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 700;">Gemini CLI</strong>
+            </span>
+        </p>
+
+        <!-- GDG Kolachi event badge (bottom) -->
+        <div style="
+            display: inline-block;
+            background: linear-gradient(90deg, #1a73e8 0%, #4285f4 55%, #ea4335 100%);
+            color: #fff;
+            font-size: 0.85rem;
+            font-weight: 700;
+            letter-spacing: 0.08em;
+            text-transform: uppercase;
+            padding: 7px 22px;
+            border-radius: 999px;
+            box-shadow: 0 3px 12px rgba(26,115,232,0.38);
+            margin-top: 88px;
+        ">GDG Kolachi &middot; Apr 25, 2026</div>
+
     </div>
 
     <!-- ============================================================ -->
@@ -159,7 +187,7 @@
             <!-- Avatar -->
             <div style="position: relative; margin-bottom: 12px;">
                 <img
-                    src="../assets/shayan.png"
+                    src="../assets/introduction/Shayan/shayan.png"
                     alt="Shayan Rais"
                     style="width: 280px; height: 280px; border-radius: 50%; object-fit: cover; border: 4px solid #e5e5e5; box-shadow: 0 8px 32px rgba(0,0,0,0.12); display: block; transition: transform 0.3s ease, box-shadow 0.3s ease;"
                     onmouseover="this.style.transform='scale(1.07)'; this.style.boxShadow='0 12px 40px rgba(21,101,192,0.35), 0 0 0 6px rgba(21,101,192,0.12)';"
@@ -169,7 +197,7 @@
 
             <!-- Name + tagline -->
             <h1 style="font-size: 2.6rem; font-weight: 700; margin-bottom: 6px; border-bottom: none; padding-bottom: 0; color: #1a1a1a;">Shayan Rais</h1>
-            <p style="font-size: 1.2rem; color: #444; margin-bottom: 18px; font-weight: 500; display: flex; align-items: center; justify-content: center; gap: 10px;">Software Architect at <img src="../assets/logo/disrupt-logo.png" alt="disrupt.com" style="height: 28px; width: auto; object-fit: contain; vertical-align: middle;" /></p>
+            <p style="font-size: 1.2rem; color: #444; margin-bottom: 18px; font-weight: 500; display: flex; align-items: center; justify-content: center; gap: 10px;">Software Architect at <img src="../assets/introduction/Shayan/disrupt-logo.png" alt="disrupt.com" style="height: 28px; width: auto; object-fit: contain; vertical-align: middle;" /></p>
 
             <!-- Side-by-side cards (2-column grid) -->
             <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 16px; width: 100%; max-width: 900px; align-items: stretch;">
@@ -183,7 +211,7 @@
                     <div style="font-size: 0.72rem; text-transform: uppercase; letter-spacing: 1.5px; color: #7b1fa2; font-weight: 700; margin-bottom: 14px; text-align: left;">Education</div>
                     <!-- Master's row -->
                     <div style="display: flex; align-items: center; gap: 16px; margin-bottom: 12px;">
-                        <img src="../assets/logo/uni-fast-logo.png" alt="FAST NUCES logo" style="width: 44px; height: 44px; object-fit: contain; flex-shrink: 0;" />
+                        <img src="../assets/introduction/Shayan/uni-fast-logo.png" alt="FAST NUCES logo" style="width: 44px; height: 44px; object-fit: contain; flex-shrink: 0;" />
                         <div style="text-align: left;">
                             <div style="font-size: 0.98rem; font-weight: 600; color: #1a1a1a; line-height: 1.3;">Master&rsquo;s in Computer Science</div>
                             <div style="font-size: 0.87rem; color: #666; margin-top: 2px;">FAST NUCES &mdash; 2019</div>
@@ -193,7 +221,7 @@
                     <div style="border-top: 1px solid #e0d4ec; margin: 4px 0 12px 0;"></div>
                     <!-- Bachelor's row -->
                     <div style="display: flex; align-items: center; gap: 16px;">
-                        <img src="../assets/logo/uni-ned-logo.png" alt="NED University logo" style="width: 44px; height: 44px; object-fit: contain; flex-shrink: 0;" />
+                        <img src="../assets/introduction/Shayan/uni-ned-logo.png" alt="NED University logo" style="width: 44px; height: 44px; object-fit: contain; flex-shrink: 0;" />
                         <div style="text-align: left;">
                             <div style="font-size: 0.98rem; font-weight: 600; color: #1a1a1a; line-height: 1.3;">Bachelor&rsquo;s in Computer Information Systems</div>
                             <div style="font-size: 0.87rem; color: #666; margin-top: 2px;">NED University &mdash; 2014</div>
@@ -1517,10 +1545,13 @@ This is a TodoApp with a FastAPI backend and React frontend.
         <p style="margin-top: 40px; font-size: 0.95rem; color: #aaa;">github.com/shanraisshan/claude-code-best-practice</p>
     </div>
 
-    <!-- Header Logo -->
+    <!-- Corner mascots (global, appear on every slide) -->
     <div class="header-logo">
         <img src="../../!/claude-jumping.svg" alt="Claude Code mascot" />
     </div>
+    <div class="header-logo right">
+        <img src="../../!/gemini-jumping.svg" alt="Gemini CLI mascot" />
+    </div>
 
     <div class="navigation">
         <button class="nav-btn" id="prevBtn" onclick="prevSlide()">&#8592;</button>
diff --git a/presentation/assets/logo/disrupt-logo.png b/presentation/assets/introduction/Shayan/disrupt-logo.png
similarity index 100%
rename from presentation/assets/logo/disrupt-logo.png
rename to presentation/assets/introduction/Shayan/disrupt-logo.png
diff --git a/presentation/assets/shayan.png b/presentation/assets/introduction/Shayan/shayan.png
similarity index 100%
rename from presentation/assets/shayan.png
rename to presentation/assets/introduction/Shayan/shayan.png
diff --git a/presentation/assets/logo/uni-fast-logo.png b/presentation/assets/introduction/Shayan/uni-fast-logo.png
similarity index 100%
rename from presentation/assets/logo/uni-fast-logo.png
rename to presentation/assets/introduction/Shayan/uni-fast-logo.png
diff --git a/presentation/assets/logo/uni-ned-logo.png b/presentation/assets/introduction/Shayan/uni-ned-logo.png
similarity index 100%
rename from presentation/assets/logo/uni-ned-logo.png
rename to presentation/assets/introduction/Shayan/uni-ned-logo.png
diff --git a/presentation/assets/introduction/Umaid/umaid.png b/presentation/assets/introduction/Umaid/umaid.png
new file mode 100644
index 0000000..c3be259
Binary files /dev/null and b/presentation/assets/introduction/Umaid/umaid.png differ
diff --git a/presentation/assets/logo/gemini.svg b/presentation/assets/logo/gemini.svg
new file mode 100644
index 0000000..c7ffc26
--- /dev/null
+++ b/presentation/assets/logo/gemini.svg
@@ -0,0 +1,25 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="20" role="img" aria-label="Gemini">
+  <title>Gemini</title>
+  <linearGradient id="g" x1="0" y1="0" x2="1" y2="0">
+    <stop offset="0" stop-color="#4285F4"/>
+    <stop offset="0.5" stop-color="#7B68EE"/>
+    <stop offset="1" stop-color="#EA4335"/>
+  </linearGradient>
+  <linearGradient id="s" x2="0" y2="100%">
+    <stop offset="0" stop-color="#bbb" stop-opacity=".1"/>
+    <stop offset="1" stop-opacity=".1"/>
+  </linearGradient>
+  <clipPath id="r">
+    <rect width="64" height="20" rx="3" fill="#fff"/>
+  </clipPath>
+  <g clip-path="url(#r)">
+    <rect width="64" height="20" fill="url(#g)"/>
+    <rect width="64" height="20" fill="url(#s)"/>
+  </g>
+  <g transform="translate(2, 2) scale(0.0625)">
+    <path d="M 128 0 C 128 64 160 96 256 128 C 160 160 128 192 128 256 C 128 192 96 160 0 128 C 96 96 128 64 128 0 Z" fill="#fff"/>
+  </g>
+  <g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="11">
+    <text x="40" y="14">Gemini</text>
+  </g>
+</svg>