feat(tasarim): katalog üstü kayıtlı-sıra satırı ve "listen hazır" paneli piksel dokulu CTA bandı

- CtaSiraForm kompakt: kayıtlı sıralamalı hâl CtaBandi kompakt kabuğuyla
  birebir (bg-primary, beyaz yazı, PikselZemin); form hâli beyaz kalır.
  İç boşluk ve saydam kenarlıkla iki hâlin kutusu aynı (CLS yok); telefondaki
  süs piksel ayracı kaldırıldı.
- /sonuc "24 tercihlik listen hazır": beyaz kart yerine CtaBandi (seed 23),
  buton sonda ArrowRight, telefonda tam genişlik.
- DESIGN.md §10.8: CtaBandi kullanım yerleri ve "piksel konmaz" listesi güncellendi.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

docs/tasarim/DESIGN.md

@@ -700,17 +700,24 @@ karar.
   yan yana, buton sağda.
 - Büyük (sayfa kapanışı) hâlinde aynı band ortalı ve iri: `px-5 py-8 text-center sm:p-12`,
   `-inset-y-10`, h2 `font-heading text-2xl font-bold sm:text-3xl`, paragraf `text-white/90`.
-- Kullanıldığı yerler: `/sonuc`'taki iki sihirbaz paneli, katalog altındaki `CtaSiraForm`
+- Kullanıldığı yerler: `/sonuc`'taki üç panel (sihirbaz, giriş bekleyen, "24 tercihlik listen
-  kart varyantı, "Kendi Listem" çekmecesinin altı (kompakt). Aynı sayfadaki iki band farklı
+  hazır"), katalog altındaki `CtaSiraForm`
-  `seed` alır.
+  kart varyantı, "Kendi Listem" çekmecesinin altı (kompakt), katalog üstü kompakt satırın
+  **kayıtlı sıralamalı** hâli ("Sıralaman … tabanlarının neresinde? · Sıralaman kayıtlı: …";
+  Bilal, 24 Eyl 2026: "bu kısma piksel dokusu ekle"). O satır CLS için tek `section` içinde
+  iki hâl taşıdığından `CtaBandi`'yi sarmaz; kompakt bandın sınıf setini birebir alır
+  (`relative isolate overflow-hidden rounded-2xl bg-primary px-5 py-4 text-left text-white
+  sm:py-5` + ilk çocuk `PikselZemin`), kenarlık saydam kalır ki iki hâlin kutusu aynı olsun.
+  Aynı sayfadaki iki band farklı `seed` alır.
 
 **Piksel zemin yalnız CTA yüzeylerinde — `PikselZemin`, `src/components/piksel-zemin.tsx`**
 (Bilal, 24 Eyl 2026: önce "her CTA benzeri kısmın arkasında olmalı", sonra "/sonuc'taki kartın
 arkasına da piksel koymuşsun; pikseller CTA'larda olacak sadece"). CTA yüzeyi = renkli zeminli
 çağrı yüzeyi: mavi `CtaBandi`, koyu kapanış kartı `PikselCtaYuzeyi`, arama penceresindeki koyu
 kart. Beyaz içerik kartlarına (tadımlık, `/listem` üretim/kilit kartları, paket kartı, kaydet
-bandı, katalog üstü kompakt satır, boş durumlar, sıralama-yok sayfası) **konmaz** — 24 Eyl'de
+bandı, katalog üstü kompakt satırın **form** hâli, boş durumlar, sıralama-yok sayfası)
-denendi ve geri alındı. Kap `relative isolate overflow-hidden`; zemin ilk çocuk; kareler beyaz.
+**konmaz** — 24 Eyl'de denendi ve geri alındı. Aynı kompakt satırın kayıtlı sıralamalı hâli
+ise formsuz tek butonlu bir çağrı olduğundan mavi banttır ve dokuyu alır (yukarıda). Kap `relative isolate overflow-hidden`; zemin ilk çocuk; kareler beyaz.
 Doku kabın gerçek ölçüsüne göre üretilir: yalnız kenar çerçevesinde (kısa kenarın %30'u), orta
 tamamen boş; **küçük kare yok**, 2–4 hücrelik (17/27/37 px) kareler, iri olan seyrek ve daha
 silik (Bilal: "çok fazla piksel, küçük olanlar hiç olmasın").

src/features/sihirbaz/components/cta-sira-form.tsx

@@ -13,7 +13,7 @@ import {
   DrawerDescription,
   DrawerTitle,
 } from "@/components/ui/drawer";
-import { PagePixelDivider } from "@/components/pixel-decor";
+import { PikselZemin } from "@/components/piksel-zemin";
 import { useGorunumOlayi } from "@/components/use-gorunum-olayi";
 import {
   SihirbazAdimlarLazy,
@@ -39,7 +39,7 @@ const PUAN_TURLERI_SECENEK = [
 ] as const;
 
 // Kayıtlı profilli CTA'lar /listem boş durumunun dilini taşır (bkz.
-// listem-bos-cta.tsx): büyük turuncu buton, piksel ayraç. Sınıf seti tek yerde.
+// listem-bos-cta.tsx): büyük turuncu buton. Sınıf seti tek yerde.
 const PROFILLI_CTA_SINIF =
   "h-12 cursor-pointer bg-orange-500 px-6 text-white transition-colors duration-200 hover:bg-orange-600";
 
@@ -369,14 +369,21 @@ export function CtaSiraForm({
     // bindirilir; hücrenin yüksekliğini her iki durumda da başlık + form belirler.
     // Profilli içerik bu yüksekliği aşmayacak kadar kısa tutulmalı.
     const kompaktBaslik = baslik ?? "Sıralaman bu tabanların neresinde?";
+    // Profilli hâl bir CTA yüzeyidir (tek iş: turuncu buton): CtaBandi'nin
+    // kompakt bandıyla birebir aynı kabuk — mavi zemin, beyaz yazı, arkada
+    // PikselZemin (DESIGN.md §10.8; piksel yalnız CTA yüzeylerinde). Profilsiz
+    // form satırı beyaz içerik kartıdır, piksel almaz. İç boşluk ve 1 px
+    // kenarlık (profilli hâlde saydam) iki hâlde aynıdır ki hydration sonrası
+    // geçişte satır yüksekliği oynamasın.
     return (
       <section
         aria-labelledby={baslikId}
         className={cn(
-          "rounded-2xl border p-4 transition-colors duration-200 sm:p-5",
+          "relative isolate overflow-hidden rounded-2xl border px-5 py-4 text-left transition-colors duration-200 sm:py-5",
-          profil ? "border-primary/20 bg-primary/5" : "border-slate-200 bg-white",
+          profil ? "border-transparent bg-primary text-white" : "border-slate-200 bg-white",
         )}
       >
+        {profil ? <PikselZemin seed={11} /> : null}
         <div className="grid">
           <div
             ref={profil ? undefined : formRef}
@@ -399,13 +406,12 @@ export function CtaSiraForm({
               <div className="flex min-w-0 flex-col items-center gap-1 sm:items-start">
                 <p
                   id={baslikId}
-                  className="font-heading text-base font-bold leading-6 text-slate-900"
+                  className="font-heading text-base font-bold leading-6 text-white"
                 >
                   {kompaktBaslik}
                 </p>
-                <KayitliSira sira={profil.sira} tur={profil.tur} />
+                <KayitliSira sira={profil.sira} tur={profil.tur} beyaz />
               </div>
-              <PagePixelDivider seed={67} className="w-24 sm:hidden" />
               <Button asChild size="lg" className={cn(PROFILLI_CTA_SINIF, "w-full sm:w-auto")}>
                 <Link href={sonucHref()}>
                   Sıralamana uygun programları gör

src/features/sihirbaz/components/sihirbaz-cagri-karti.tsx

@@ -262,22 +262,28 @@ export function SihirbazBolumu({
           edilmez; panel yalnızca funnel CTA'larını gösterir, üretim ve
           listenin kendisi /listem'de yaşar. */}
       {raporVar ? (
-        <section className="mt-16 rounded-2xl border border-slate-200 bg-white p-8 text-center sm:p-12">
+        // Kardeş panellerle aynı yüzey (DESIGN.md §10.8 CtaBandi): mavi zemin,
-          <h2 className="font-heading text-2xl font-bold sm:text-3xl">
+        // piksel doku, tek turuncu buton (Bilal, 24 Eyl 2026: "buraya piksel
+        // doku ekle"). Seed diğer iki panelden (13, 19) farklı.
+        <CtaBandi seed={23} className="mt-16 min-w-0">
+          <h2 className="font-heading text-2xl font-bold text-balance sm:text-3xl">
             24 tercihlik listen hazır
           </h2>
-          <p className="mx-auto mt-3 max-w-xl text-slate-600">
+          <p className="mx-auto mt-3 max-w-xl text-base leading-relaxed text-white/90">
             Yapay zekânın kurduğu risk analizli listen Listem sayfasında
             seni bekliyor.
           </p>
           <Button
             asChild
             size="lg"
-            className="mt-6 cursor-pointer bg-orange-500 text-white transition-colors duration-200 hover:bg-orange-600"
+            className="mt-6 h-12 w-full cursor-pointer bg-orange-500 px-6 text-white transition-[background-color,transform] duration-200 hover:bg-orange-600 active:scale-[0.97] sm:w-auto"
           >
-            <Link href="/listem">Listeni gör</Link>
+            <Link href="/listem">
+              Listeni gör
+              <ArrowRight className="size-4" aria-hidden />
+            </Link>
           </Button>
-        </section>
+        </CtaBandi>
       ) : girisBekliyor ? (
         <CtaBandi ref={hazirPanelRef} seed={13} className="mt-16 min-w-0">
           <h2 className="font-heading text-2xl font-bold text-balance sm:text-3xl">