feat(tasarim): üniversite sayfası "şişko ve sade" dile göre baştan, DESIGN.md know-how'ı

Üniversite sayfası (canlı referans ekran /universite/ankara-universitesi):
- Program listesi: ad kesilmez/sarar, telefonda taban sıra alt satıra iner,
  satır butonları 44 px, tür çipi okunur boyda
- Başlık bloğu lg altında ortalı (logo başlığın üstünde), kimlik hapları
  (Devlet/Ankara) navbar ölçüsünde, ikon + metin
- Harita yanında 4 özet kartı (OzetKart): sayı solda iri, ikon sağda;
  4. kart URAP Türkiye sırası + piksel sıra şeridi (PixelSira)
- Akademik göstergeler (URAP + YÖK İstatistik) sayfadan "Akademik
  göstergeler ›" satırının açtığı alt sayfaya taşındı: kartsız, ortalı,
  masonry gösterge kareleri, tek ekrana sığar
- Hover tek turuncu (orange-500); liste satırı adı mavi kalır
- Üst çubuk başlık geçişi (NavBaslik): h1 kaydırılınca üst çubukta logo +
  ad belirir; bölüm sayfasında da (yalnız ad)

Tasarım dili:
- DESIGN.md: temel his (§1.1), hover kuralı (§2.1), yazı alt sınırları,
  yeni tek kaynak parçalar (§4.8–4.15), lg altı ortala (§5.2), reddedilen
  denemeler (§7), ölç-tahmin-etme ve tuzaklar (§9)
- Denetim: gösterge karesi renk istisnası (bg-indigo-500, bg-green-600) ve
  site taraması için dört uyarı (minik-yazi, buyuk-harf-etiket, mavi-hover,
  iri-sayi-tabular)

Not: universite-icerik.tsx'teki akademik göstergeler bölümü (URAP/YÖK
kartları) Bilal'in commit'lenmemiş işiydi; tasarım değişiklikleriyle aynı
dosyada iç içe olduğu için bu commit'e girdi.

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

src/features/katalog/components/akademik-ayrinti.tsx

@@ -0,0 +1,72 @@
+"use client";
+
+import type { ReactNode } from "react";
+import { ChevronRight, GraduationCap, X } from "lucide-react";
+import {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerTitle,
+  DrawerTrigger,
+} from "@/components/ui/drawer";
+
+/**
+ * Üniversite sayfasında özet kartlarının altındaki "Akademik göstergeler ›"
+ * satırı (Apple Sağlık'taki "Tüm verileri göster" gibi): sık bakılan sayılar
+ * kartlarda, ayrıntı bir dokunuş derinde. İkinci satır içeride ne olduğunu
+ * önceden söyler. Ayrıntı alttan açılan çekmecede; çekmece ve kapatma
+ * çarpısı cta-sira-form.tsx'teki çekmeceyle birebir aynı sınıf setinde.
+ * Kartlar sunucuda üretilip `children` olarak gelir.
+ */
+export function AkademikAyrinti({
+  universite,
+  onizleme,
+  children,
+}: {
+  universite: string;
+  onizleme: string;
+  children: ReactNode;
+}) {
+  return (
+    <Drawer handleOnly>
+      <DrawerTrigger asChild>
+        <button
+          type="button"
+          className="mt-4 flex w-full cursor-pointer items-center gap-4 group rounded-2xl border border-slate-200 bg-white p-4 text-left transition-[background-color,border-color,transform] duration-150 hover:border-orange-500 hover:bg-orange-50/60 active:scale-[0.99] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:p-5"
+        >
+          <span className="flex size-11 shrink-0 items-center justify-center rounded-xl bg-primary/10">
+            <GraduationCap className="size-5 text-primary" aria-hidden />
+          </span>
+          <span className="min-w-0 flex-1">
+            <span className="block font-heading text-lg font-bold text-slate-900">
+              Akademik göstergeler
+            </span>
+            <span className="block truncate text-sm text-slate-500">
+              {onizleme}
+            </span>
+          </span>
+          <ChevronRight
+            className="size-5 shrink-0 text-slate-400 transition-[color,transform] duration-150 group-hover:translate-x-0.5 group-hover:text-orange-500"
+            aria-hidden
+          />
+        </button>
+      </DrawerTrigger>
+      <DrawerContent className="max-h-[92dvh] bg-white sm:mx-auto sm:max-w-2xl sm:border-x sm:border-slate-200 sm:shadow-2xl">
+        <DrawerClose className="absolute top-3 right-3 z-10 flex size-9 cursor-pointer items-center justify-center rounded-full border border-slate-200 bg-popover text-slate-500 transition-[background-color,transform] duration-150 hover:bg-slate-100 hover:text-slate-800 active:scale-[0.96]">
+          <X className="size-4" aria-hidden />
+          <span className="sr-only">Kapat</span>
+        </DrawerClose>
+        <div className="min-h-0 flex-1 overflow-y-auto px-4 pt-5 pb-[max(1.25rem,env(safe-area-inset-bottom))] sm:px-6">
+          <DrawerTitle className="px-10 text-center font-heading text-2xl font-bold text-slate-900">
+            Akademik göstergeler
+          </DrawerTitle>
+          <DrawerDescription className="mt-1 px-10 text-center text-sm text-slate-500">
+            {universite}
+          </DrawerDescription>
+          <div className="mt-5">{children}</div>
+        </div>
+      </DrawerContent>
+    </Drawer>
+  );
+}