diff --git a/src/pages/index.astro b/src/pages/index.astro
index d4837d7..06b7dfe 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -133,8 +133,19 @@ const hours = [
       <figure><img src="/img/g4.webp" alt="Im Salon" loading="lazy" /></figure>
       <figure><img src="/img/g5.webp" alt="Detail" loading="lazy" /></figure>
     </div>
-    <div class="insta-cta reveal">
-      <a href="https://www.instagram.com/friseur.team_vk/" target="_blank" rel="noopener" class="btn btn-ghost">📸 Folgt uns @friseur.team_vk</a>
+    <div class="reels-head reveal">
+      <h3>Reels &amp; Motion · 9:16</h3>
+      <span>Hochformat-Content fürs Handy – direkt für Instagram &amp; TikTok.</span>
+    </div>
+    <div class="reels reveal">
+      <figure class="reel"><img src="/img/g1.webp" alt="Reel Coloration" loading="lazy" /><span class="rlabel">Vorher / Nachher</span></figure>
+      <figure class="reel"><img src="/img/hero.webp" alt="Reel Salon" loading="lazy" /><span class="rlabel">Salon-Tour</span></figure>
+      <figure class="reel"><img src="/img/g3.webp" alt="Reel Styling" loading="lazy" /><span class="rlabel">Styling-Clip</span></figure>
+      <figure class="reel"><img src="/img/g2.webp" alt="Reel Behind the scenes" loading="lazy" /><span class="rlabel">Behind the Scenes</span></figure>
+    </div>
+    <div class="insta-cta reveal" style="margin-top:1.6rem">
+      <span class="demo-flag">Demo · hier laufen später echte 9:16-Clips</span>
+      <div style="margin-top:1rem"><a href="https://www.instagram.com/friseur.team_vk/" target="_blank" rel="noopener" class="btn btn-ghost">📸 Folgt uns @friseur.team_vk</a></div>
     </div>
   </div>
 </section>
diff --git a/src/styles/global.css b/src/styles/global.css
index c4db896..e1a4a0d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -156,6 +156,18 @@ section { padding: clamp(72px, 10vw, 130px) 0; }
 .gallery .tall { grid-row: span 2; }
 .insta-cta { text-align: center; margin-top: 2rem; }
 
+/* REELS 9:16 */
+.reels-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 3rem 0 1.2rem; flex-wrap: wrap; }
+.reels-head h3 { font-size: 1.5rem; }
+.reels-head span { font-size: 0.9rem; color: var(--soft); }
+.reels { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
+.reel { aspect-ratio: 9/16; border-radius: var(--radius); overflow: hidden; position: relative; border: 1px solid var(--border); }
+.reel img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
+.reel:hover img { transform: scale(1.06); }
+.reel::after { content: "▶"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 1.6rem; background: linear-gradient(180deg, rgba(26,26,26,.05), rgba(26,26,26,.45)); text-shadow: 0 2px 12px rgba(0,0,0,.4); transition: transform 0.3s; }
+.reel:hover::after { transform: scale(1.15); }
+.reel .rlabel { position: absolute; left: 10px; bottom: 10px; z-index: 2; font-size: 0.7rem; font-weight: 600; color: #fff; background: rgba(26,26,26,.55); backdrop-filter: blur(4px); padding: 3px 9px; border-radius: 20px; }
+
 /* WALLET / STEMPELKARTE */
 .wallet-sec { background: linear-gradient(160deg, var(--nude), var(--cream-2)); }
 .wallet-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: center; }