feat(tasarim): funnel CTA'ları arama kartı dilinde, 24'lük piksel liste kreatifi

- PikselCtaYuzeyi: koyu slate-950 yüzey, yazılıp silinen satırlar, tek
  turuncu CTA (arama penceresindeki kartın dili); ana sayfa kapanışı ve
  /sonuc'taki iki panelde köşeye kümelenen PixelField'in yerine
- PikselListe: 24 kare = 24 tercih; kendini kurar (5 hayal · 13 dengeli ·
  6 güvenli), imlece tepki verir, CTA'ya gelince tamamı dolar, dokunmada
  nabız; hareketi azalt'ta durağan; renk hep metinle
- Liste çekmecesi: ilerleme çubuğunun yerinde öğrencinin kendi listesi
  pikselde (her kare o tercihin riski); başlık yan yana dizildi, liste
  alanı 150 → 234 px (375 px ölçümü)
- Funnel metinleri src/lib/funnel-metinleri.ts'e taşındı

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/app/globals.css

@@ -303,3 +303,21 @@
     mask-image: none;
   }
 }
+
+/* 24'lük piksel listede dokunma nabzı (bkz. components/piksel-liste.tsx):
+   basılan kare ve komşuları kısa bir büyüyüp söner. Tek seferlik, 420 ms. */
+@keyframes kt-piksel-nabiz {
+  0% {
+    transform: scale(1);
+  }
+  35% {
+    transform: scale(1.3);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+.kt-piksel-nabiz {
+  animation: kt-piksel-nabiz 0.42s cubic-bezier(0.23, 1, 0.32, 1);
+}

src/app/page.tsx

@@ -25,9 +25,9 @@ import { TurkeyPixelMap } from "@/features/pazarlama/components/turkey-pixel-map
 import {
   PixelCorner,
   PixelDivider,
-  PixelField,
   SectionEyebrow,
 } from "@/components/pixel-decor";
+import { PikselCtaYuzeyi } from "@/components/piksel-cta-yuzeyi";
 import { MAX_REVIZYON, URUNLER } from "@/lib/credits";
 import { VERI_YIL_SAYISI } from "@/lib/veri-kapsami";
 import {
@@ -681,28 +681,14 @@ export default function Home() {
         <section className="px-4 pb-24 pt-6 sm:px-6">
           <Parallax strength={12} className="mx-auto max-w-6xl">
             <Reveal>
-              <div className="relative isolate overflow-hidden rounded-3xl bg-primary px-4 py-20 text-white shadow-xl shadow-primary/20 sm:py-24">
-                {/* Hero'nun piksel dokusu koyu zeminde: ortası boş, kenarlara doğru yoğun */}
-                {/* Piksel zemin panel içinde geride kalır; taşma payı için dikeyde büyütülür */}
-                <div
-                  aria-hidden
-                  className="pointer-events-none absolute inset-x-0 -inset-y-10 -z-10 text-white"
-                >
-                  <Parallax strength={-22} className="h-full">
-                    <PixelField seed={8} />
-                  </Parallax>
-                </div>
-                <div className="mx-auto flex max-w-3xl flex-col items-center text-center">
-                  <MessageCircleQuestion
-                    className="size-10 opacity-80"
-                    aria-hidden
-                  />
-                  <h2 className="mt-6 font-heading text-3xl font-bold sm:text-4xl">
-                    Tercih listen, pişmanlık listesi olmasın
-                  </h2>
-                  <KapanisCta />
-                </div>
-              </div>
+              {/* Funnel CTA yüzeyi (DESIGN.md §10.8): köşede kümelenen
+                  piksel zemini yerine 24'lük listenin interaktif kreatifi */}
+              <PikselCtaYuzeyi metinOfseti={7}>
+                <h2 className="font-heading text-3xl font-bold text-balance sm:text-4xl">
+                  Tercih listen, pişmanlık listesi olmasın
+                </h2>
+                <KapanisCta />
+              </PikselCtaYuzeyi>
             </Reveal>
           </Parallax>
         </section>