feat(katalog+tasarim): şehir adları her yerde link; piksel yüzeylere beyaz ton

- ilSayfaHref: üniversite sayfası il hapı, /universiteler listesi, bölüm /
  sonuç / listem / tadımlık satırlarındaki il metası şehir sayfasına gider.
- Şehir kümeleri tüm (üniversite, il) çiftlerinden: DB'deki her il değerinin
  sayfası var (ODTÜ Ankara + KKTC); dev'de eski globalThis önbelleğine dayanıklı.
- PikselZemin ton="acik", CtaBandi/CtaSiraForm ton="beyaz": /universiteler
  altı ve /meraklisina kapanışı beyaz, diğer bantlar mavi (dönüşümlü).
- ilUlkeHaritasi: il değerinden ülke haritası + şehir konumu.

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

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

@@ -101,6 +101,9 @@ function KayitliSira({
  * tabloya bağlayan köprü cümlesini buradan verir. Başlık ve açıklamalar
  * yerleşme vaadi içermez: ürün sıralamaya yakın programları listeler.
  *
+ * `ton="beyaz"`: kart varyantının beyaz zeminli bandı (aynı sayfada iki mavi
+ * bant üst üste gelmesin diye; DESIGN.md §10.8).
+ *
  * `varyant="kompakt"`: katalog sayfalarında başlığın hemen altına, tablonun
  * ÜSTÜNE konan tek satırlık sürüm. Sıralama alanı çekmecede değil doğrudan
  * sayfadadır (tek sayfada çıkan ziyaretçi alttaki karta hiç inmiyor); gönderince
@@ -113,10 +116,13 @@ export function CtaSiraForm({
   aciklama,
   varyant = "kart",
   konum = "alt",
+  ton = "mavi",
 }: {
   baslik?: string;
   aciklama?: string;
   varyant?: "kart" | "kompakt";
+  /** Yalnız kart varyantı: bandın zemini */
+  ton?: "mavi" | "beyaz";
   /** Yalnız ölçüm içindir: formun sayfadaki yeri (tablonun üstü / altı). */
   konum?: "ust" | "alt";
 }) {
@@ -427,16 +433,18 @@ export function CtaSiraForm({
   }
 
   // Kart varyantı sayfa sonundaki CTA bandıdır (DESIGN.md §10.8, CtaBandi).
+  const beyaz = ton === "beyaz";
+  const paragrafSinifi = beyaz ? "text-slate-600" : "text-white/90";
   if (profil) {
     return (
-      <CtaBandi seed={5}>
+      <CtaBandi seed={5} ton={ton}>
         <h2 className="font-heading text-2xl font-bold text-balance sm:text-3xl">
           {baslik ?? "Sıralamana yakın programlar hangileri? Saniyede gör."}
         </h2>
         <div className="mt-3">
-          <KayitliSira sira={profil.sira} tur={profil.tur} beyaz />
+          <KayitliSira sira={profil.sira} tur={profil.tur} beyaz={!beyaz} />
         </div>
-        <p className="mx-auto mt-2 max-w-xl text-base leading-relaxed text-white/90">
+        <p className={cn("mx-auto mt-2 max-w-xl text-base leading-relaxed", paragrafSinifi)}>
           Gerçek YÖK Atlas verisiyle hayal, dengeli ve güvenli dilimlerindeki
           programların hazır.
         </p>
@@ -456,11 +464,11 @@ export function CtaSiraForm({
 
   return (
     <div ref={formRef}>
-      <CtaBandi seed={9}>
+      <CtaBandi seed={9} ton={ton}>
         <h2 className="font-heading text-2xl font-bold text-balance sm:text-3xl">
           {baslik ?? "Sıralamana yakın programlar hangileri? Saniyede gör."}
         </h2>
-        <p className="mx-auto mt-3 max-w-xl text-base leading-relaxed text-white/90">
+        <p className={cn("mx-auto mt-3 max-w-xl text-base leading-relaxed", paragrafSinifi)}>
           {aciklama ??
             "YKS başarı sıralamanı gir; gerçek YÖK Atlas verisiyle sıralamana uygun hayal, dengeli ve güvenli dilimlerindeki programları anında listele. Ücretsiz, üyelik gerekmez."}
         </p>