/* =====================================================================
 * anasayfa-vakar.css — ana sayfanın "vakar" katmanı (24 Eylül 2026)
 *
 * KİM İÇİN: kurumun kendisi ve ziyaretçileri — çoğu yaşça büyük, dindar,
 * ilim geleneğine saygı duyan insanlar; bir de El Mustafa Üniversitesi'nin
 * resmî yüzü. Sayfa bir "uygulama tanıtımı" gibi değil, bir medresenin
 * kapısı gibi durmalı: sakin, okunaklı, ağırbaşlı.
 *
 * NE DEĞİŞİR, NE DEĞİŞMEZ:
 *  - İÇERİK DEĞİŞMEZ. Hiçbir metin, bölüm, sıra ya da panel alanı bu dosyada
 *    yok; hepsi eskisi gibi panelden gelir. Bu dosya yalnız görünümdür.
 *  - Oyuncaklı süsler (konfeti çizgicikleri, noktalı yol, dalga, sarı
 *    kıvrım, fosforlu kalem) kalkar; yerine kitap sanatının dili gelir:
 *    sekiz köşeli yıldız (hâtem), altın saç teli, koyu bantta girih
 *    örgüsü. (Kemer/mihrap çerçeve 30 Eylül 2026'da kalktı: okullar
 *    girih şeritli kart, görseller düz dikdörtgen.)
 *  - Başlıklar kitap harfiyle (Literata) dizilir; gövde metni büyür ve
 *    koyulaşır, ince mono künyeler okunur bir yazıya döner.
 *
 * SIRA: cekirdek.css → style.css → anasayfa.css → BU DOSYA.
 * GERİ ALMAK: index.php'deki bu dosyanın <link> satırını silmek yeter.
 * Renkler panel temasından gelir (css/tema.php): --birincil, --vurgu …
 * ===================================================================== */

.ana-kapi {
  --vk-serif: 'Literata', 'Noto Serif Georgian', Georgia, 'Times New Roman', serif;
  --vk-arap: 'Amiri', 'Noto Naskh Arabic', serif;
  --vk-altin: var(--vurgu);
  --vk-altin-ince: color-mix(in srgb, var(--vurgu) 55%, transparent);
  --vk-metin: color-mix(in srgb, var(--murekkep) 78%, var(--murekkep-2));
  /* İnce mono künyeler yaşlı gözde okunmuyordu: sayfa içinde mono aile
     gövde yazısına eşlenir, harf aralığı ve büyük harf kuralları kalır. */
  --yz-mono: var(--yz-metin);
  /* Sekiz köşeli yıldız (iki kare, 45° döndürülmüş) — maske olarak. */
  --vk-yildiz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0l3.1 4.5 5.4-1-1 5.4L24 12l-4.5 3.1 1 5.4-5.4-1L12 24l-3.1-4.5-5.4 1 1-5.4L0 12l4.5-3.1-1-5.4 5.4 1z'/%3E%3C/svg%3E");
  /* Girih örgüsü — yıldız ve haç düzeni, saç teli. Renk dış katmandan
     (mask) değil doğrudan beyaz; yalnız koyu bantta kullanılır. */
  --vk-girih: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff' stroke-width='1'%3E%3Cpath d='M48 14l10 14 17-3-3 17 14 10-14 10 3 17-17-3-10 14-10-14-17 3 3-17-14-10 14-10-3-17 17 3z'/%3E%3Cpath d='M48 28l7 13 13 7-13 7-7 13-7-13-13-7 13-7z'/%3E%3Cpath d='M0 0l21 21M96 0L75 21M0 96l21-21M96 96L75 75M48 0v14M48 82v14M0 48h14M82 48h14'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Süs katmanı: oyuncaklı öğeler kalkar ---------- */
.ana-kapi .kp-dekor--konfeti,
.ana-kapi .kp-dekor--yol,
.ana-kapi .kp-dekor--dalga,
.ana-kapi .kp-dekor--izgara,
.ana-kapi .kp-bas__kivrim { display: none; }

/* Koyu bantta girih örgüsü: eski dört yönlü çizgi ızgarasının yerine.
   Metnin arkasında, %6 beyaz — kontrastı değiştirmez. */
.ana-kapi .kp-serit--koyu::after {
  background-image: var(--vk-girih);
  background-size: 96px 96px;
  opacity: .075;
}

/* ---------- Bölüm başlıkları ---------- */
.ana-kapi .kp-etiket,
.kp-etiket {
  gap: 10px; min-height: 26px;
  font-family: var(--yz-metin); font-size: 12.5px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--birincil-koyu);
}
.ana-kapi .kp-etiket::before {
  width: 11px; height: 11px; background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
/* Ortalanmış başlıkta yıldız iki yanda: kitap sayfasındaki serlevha gibi. */
.ana-kapi .kp-bas:not(.kp-bas--yan) .kp-etiket::after {
  content: ""; flex: none; width: 11px; height: 11px; background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-serit--koyu .kp-etiket { color: var(--yuzey); }

.ana-kapi .kp-bas__baslik {
  font-family: var(--vk-serif); font-weight: 600;
  font-size: clamp(30px, 3.3vw, 46px); line-height: 1.16;
  letter-spacing: -.012em; text-wrap: balance;
}
.ana-kapi .kp-bas__alt {
  font-size: 17px; line-height: 1.7; color: var(--vk-metin); max-width: 62ch;
}
.ana-kapi .kp-serit--koyu .kp-bas__alt { color: var(--yuzey); opacity: .9; }
.ana-kapi .kp-bas__dugme {
  min-height: 46px; padding: 11px 20px; border-radius: 10px;
  font-size: 15px; font-weight: 600;
}

/* ---------- 1. Slider (koyu sahne) ---------- */
.ana-kapi .kp-slayt__etiket {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--yz-metin); font-size: 13px; font-weight: 600;
  letter-spacing: .22em; opacity: .9;
}
.ana-kapi .kp-slayt__etiket::before {
  content: ""; width: 12px; height: 12px; flex: none; background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-slayt__baslik {
  font-family: var(--vk-serif); font-weight: 600;
  font-size: clamp(34px, 4.3vw, 58px); line-height: 1.14; letter-spacing: -.012em;
  text-wrap: balance;
}
/* Fosforlu kalem kalkar: vurgulanan söz ALTIN renkle yazılır. Panelde
   "vurgu" alanı aynen çalışır, yalnız görünüşü değişir. */
.ana-kapi .kp-slayt__baslik .fosfor {
  padding: 0; background: none; border-radius: 0; color: var(--vk-altin);
}
.ana-kapi .kp-slayt__alt { font-size: 18px; line-height: 1.7; opacity: .93; }
.ana-kapi .kp-serit--koyu .kp-slayt__dugme,
.ana-kapi .kp-serit--koyu .kp-cta__dugme {
  background: var(--vk-altin); border-color: var(--vk-altin); color: var(--murekkep);
  border-radius: 10px; min-height: 54px; padding: 14px 28px;
  font-size: 16px; font-weight: 700;
}
.ana-kapi .kp-serit--koyu .kp-slayt__dugme:hover,
.ana-kapi .kp-serit--koyu .kp-cta__dugme:hover {
  background: color-mix(in srgb, var(--vk-altin) 86%, var(--murekkep));
  color: var(--murekkep);
}

/* Görsel: renkli disk ve eğik şeritler yerine MADALYON — görselin çevresinde
   ince altın halka ve onun dışında ikinci, daha soluk bir halka. */
.ana-kapi .kp-sahne__serit { display: none; }
.ana-kapi .kp-slayt__gorsel--daire .kp-sahne__halka {
  width: min(580px, 104%); background: none;
  border: 1px solid var(--vk-altin-ince);
}
.ana-kapi .kp-slayt__gorsel--daire img {
  border: 3px solid color-mix(in srgb, var(--vk-altin) 80%, transparent);
  box-shadow:
    0 0 0 10px color-mix(in srgb, var(--yuzey) 7%, transparent),
    0 28px 60px -26px color-mix(in srgb, var(--murekkep) 80%, transparent);
}
.ana-kapi .kp-slayt__gorsel:not(.kp-slayt__gorsel--daire) .kp-sahne__halka { display: none; }
.ana-kapi .kp-slayt__gorsel:not(.kp-slayt__gorsel--daire) img {
  border: 1px solid var(--vk-altin-ince);
}

/* Kumanda: yaşlı el için büyük ve belirgin */
.ana-kapi .kp-slider > .kp-slider__ok { width: 52px; height: 52px; }
.ana-kapi .kp-slider__nokta { min-width: 12px; min-height: 12px; }

/* ---------- 2. Rakam şeridi ---------- */
.ana-kapi .kp-rakam b,
.ana-kapi .kp-rakam__govde b {
  font-family: var(--vk-serif); font-weight: 600; letter-spacing: 0;
}
.ana-kapi .kp-rakam__govde > span,
.ana-kapi .kp-rakam__govde small { font-size: 14px; opacity: .92; }
.ana-kapi .kp-serit--rakam .kp-rakam + .kp-rakam { border-color: var(--vk-altin-ince); }
.ana-kapi .kp-rakam__ikon { color: var(--vk-altin); }

/* ---------- Kart ailesi ---------- */
.ana-kapi .kp-kart { border-radius: 14px; }
.ana-kapi .kp-kart:hover { border-color: var(--vk-altin-ince); }

/* ---------- 3. Okullar ---------- */
.ana-kapi .kp-okul-grup__baslik {
  font-family: var(--yz-metin); font-size: 13px; font-weight: 700;
  letter-spacing: .16em; color: var(--birincil-koyu);
}
.ana-kapi .kp-okul-grup__baslik::before {
  width: 11px; height: 11px; border-radius: 0; background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
/* Okul kartları (girih şeritli) anasayfa.css §10'da. */

/* ---------- 4. Tanıtım ---------- */
/* Kolaj görseli düz dikdörtgen, beyaz pervaz ve altın saç teliyle. Kemer
   biçimi 30 Eylül 2026'da kalktı (kullanıcı: "kemerli yapıyı istemiyoruz");
   hoca portreleriyle aynı küçük köşe. */
.ana-kapi .kp-tanitim__gorsel {
  border-radius: 8px;
  border: 6px solid var(--yuzey); background: var(--yuzey);
  box-shadow: 0 0 0 1px var(--vk-altin-ince), 0 24px 50px -30px color-mix(in srgb, var(--murekkep) 70%, transparent);
}
.ana-kapi .kp-tanitim__gorsel img { border-radius: inherit; }
.ana-kapi .kp-tanitim__metin p { font-size: 17px; line-height: 1.75; color: var(--vk-metin); }
.ana-kapi .kp-tanitim__madde { font-size: 16px; line-height: 1.55; }
.ana-kapi .kp-tanitim__madde svg { color: var(--vk-altin); }

/* ---------- 5. Kurslar ---------- */
.ana-kapi .kp-sekme { font-size: 15px; min-height: 42px; }
.ana-kapi .kp-kurs__ad { font-size: 17px; line-height: 1.35; }
.ana-kapi .kp-kurs__okul { font-size: 12.5px; letter-spacing: .12em; }
.ana-kapi .kp-kurs__kunye { font-size: 14px; }

/* ---------- 7. Hocalar ---------- */
.ana-kapi .kp-hoca__ad { font-family: var(--vk-serif); font-size: 19px; font-weight: 600; }
.ana-kapi .kp-hoca__unvan { font-size: 14px; }
/* YAZAR PORTRESİ (30 Eylül 2026). Eski düzen: beyaz kart, adın altında
   kemerli fotoğraf, fotoğrafın üstünde dolgulu "1 kurs" hapı. Kullanıcı
   "çok AI slop" buldu; kemer + hap + kart üçlüsü her şablonda aynı. Şimdi
   kitabın arka kapağındaki yazar fotoğrafı gibi: kart kabuğu yok, fotoğraf
   önde sade bir dikdörtgen, altında kitap harfiyle ad, ardından unvan ve
   kurs sayısı düz metin. Fotoğrafsız kart (özetli) kartlığını korur. */
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-kart {
  padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; text-align: left;
}
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-kart:hover { box-shadow: none; transform: none; }
.ana-kapi .kp-hoca__foto {
  order: -1; margin: 0; border-radius: 6px; overflow: hidden; background: var(--yuzey-2);
  box-shadow: none;
}
.ana-kapi .kp-hoca__foto img {
  aspect-ratio: 4 / 5; object-fit: cover; object-position: center 18%;
  transition: transform .45s cubic-bezier(.2, .7, .2, 1);
}
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-kart:hover .kp-hoca__foto img { transform: scale(1.035); }
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-hoca__bilgi { padding: 14px 2px 0; }
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-hoca__ad a::after { border-radius: 6px; }
/* Fotoğraf da tıklanır (30 Eylül 2026, kullanıcı: "fotoğrafa tıklayınca da
   gitsin"). Adın kartı kaplayan ::after katmanı vardı ama fotoğraf kutusu
   (position: relative, DOM'da addan sonra) onun ÜSTÜNE boyanıyor, tıklamayı
   yutuyordu. Katman z-index ile öne alınır. */
.ana-kapi .kp-hoca__ad a::after { z-index: 1; }
/* Kurs sayısı fotoğrafın üstünde hap değil, adın altında künye satırı. */
.ana-kapi .kp-hoca:not(.kp-hoca--fotosuz) .kp-hoca__kunye {
  position: static; margin: 6px 2px 0; padding: 0; border-radius: 0; background: none;
  font-family: var(--yz-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--murekkep-2);
}
.ana-kapi .kp-hoca--fotosuz .kp-hoca__kunye { font-size: 13px; letter-spacing: .02em; }
@media (prefers-reduced-motion: reduce) { .ana-kapi .kp-hoca__foto img { transition: none; } }
/* Fotoğrafsız kart: başta küçük altın yıldız, özet okunur boyda. */
.ana-kapi .kp-hoca--fotosuz .kp-kart::before {
  content: ""; display: block; width: 18px; height: 18px; margin: 0 0 14px;
  background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-hoca__ozet { font-size: 15.5px; line-height: 1.7; color: var(--vk-metin); }

/* ---------- 8. Söz Kitapta ---------- */
/* Büyük süslü tırnak yerine altın yıldız; söz kitap harfiyle, künye altın
   saç telinin altında. Ayetlerin mealine yakışan sakin bir dizgi. */
.ana-kapi .kp-soz__tirnak {
  display: block; width: 18px; height: 18px; font-size: 0; color: transparent;
  background: var(--vk-altin);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-soz__metin {
  font-family: var(--vk-serif); font-size: 20px; font-weight: 500;
  font-style: italic; line-height: 1.55; color: var(--murekkep);
}
.ana-kapi .kp-soz__kaynak {
  padding-top: 12px; border-top: 1px solid var(--vk-altin-ince);
  font-size: 13.5px; letter-spacing: .02em; color: var(--birincil-koyu);
}

/* ---------- 9. Görüşler ---------- */
.ana-kapi .kp-gorus__metin {
  font-family: var(--vk-serif); font-size: 19px; line-height: 1.6; font-style: italic;
}
.ana-kapi .kp-gorus__tirnak { color: var(--vk-altin); }
.ana-kapi .kp-gorus__ad { font-size: 16px; }
.ana-kapi .kp-gorus__unvan { font-size: 14px; }

/* ---------- 10. Kitaplar ---------- */
.ana-kapi .kp-kitap__ad { font-family: var(--vk-serif); font-size: 17px; font-weight: 600; }
.ana-kapi .kp-kitap__ozet { font-size: 14.5px; line-height: 1.6; }

/* ---------- 11. Yazılar ---------- */
.ana-kapi .kp-yazi__ad { font-family: var(--vk-serif); font-size: 18px; font-weight: 600; line-height: 1.35; }
.ana-kapi .kp-yazi__kunye { font-size: 13.5px; }

/* ---------- 12. Lisanslar ---------- */
/* Belge simgesi sekiz köşeli mühür içinde. */
.ana-kapi .kp-lisans__logo--yok {
  border-radius: 0; background: var(--birincil-acik);
  -webkit-mask: var(--vk-yildiz) center / contain no-repeat;
          mask: var(--vk-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-lisans__ad { font-size: 16px; line-height: 1.4; }
.ana-kapi .kp-lisans__not { font-size: 14px; }

/* ---------- 13. Nasıl çalışır (dizin) ---------- */
.ana-kapi .dizin-satir { padding-block: 20px; }
.ana-kapi .dizin-satir h3 { font-family: var(--vk-serif); font-size: 20px; font-weight: 600; }
.ana-kapi .dizin-baslik svg { color: var(--vk-altin); width: 20px; height: 20px; }
.ana-kapi .dizin-git { font-size: 14.5px; }
.ana-kapi .dizin-satir p { font-size: 16.5px; max-width: 68ch; line-height: 1.65; color: var(--vk-metin); }
.ana-kapi .dizin-meta { font-size: 13.5px; }

/* ---------- 15. Kapanış çağrısı ---------- */
.ana-kapi .kp-cta__baslik { font-family: var(--vk-serif); font-weight: 600; letter-spacing: -.01em; }
.ana-kapi .kp-cta__alt { font-size: 17px; line-height: 1.7; }
/* Görsel daire ya da kemer değil, düz dikdörtgen (30 Eylül 2026, kemerler
   kalktı): sayfanın öbür görselleriyle aynı küçük köşe. */
.ana-kapi .kp-cta__gorsel img,
.ana-kapi .kp-cta__gorsel {
  border-radius: 8px;
}
.ana-kapi .kp-cta__gorsel img { border: 3px solid color-mix(in srgb, var(--vk-altin) 80%, transparent); }
.ana-kapi .kp-cta .kp-sahne__halka { display: none; }

@media (max-width: 640px) {
  .ana-kapi .kp-slayt__alt { font-size: 17px; }
  .ana-kapi .kp-soz__metin { font-size: 18.5px; }
}

/* Kart üstü rozetler (okul adı, yazı kategorisi) 11,5 px'ti: en küçük okunur
   boy 12,5 px. */
.ana-kapi .kp-kurs__rozet,
.ana-kapi .kp-yazi__rozet,
.ana-kapi .kp-tanitim__rozet { font-size: 12.5px; }

/* =====================================================================
 * Haftalık canlı ders programı: "AKŞAM ÇİZELGESİ" (28 Eylül 2026)
 * Markup ve gerekçe: anasayfa/bolum-program.php; davranış js/aksam-cizelgesi.js.
 * Gece kartı; gerçek zaman ölçekli eksen alacakaranlıktan geceye koyulaşır;
 * dersler süresiyle orantılı blok, rengi alanından (--rol, markup'tan).
 * Renkler kurumsal.css gece jetonlarından (--kb-*), tema değişince uyar.
 * ===================================================================== */
.ana-kapi .kp-aksam {
  --gunkol: 150px;
  /* Alan renkleri: gece kartı her temada koyu, bu yüzden temanın anlamsal
     jetonları (camgöbeği, dikkat) yerine koyu zeminde birbirinden ayrılan
     sabit bir takım. Bazı temalarda --dikkat ile --vurgu aynı renk; o zaman
     Ahlak ile Tarih aynı görünüyordu. Ahlak kurumun lamba rengi kalır. */
  --alan-kuran: #57B9CF; --alan-akaid: #8EA2FF; --alan-ahlak: var(--kb-lamba);
  --alan-fikih: #5FCF8E; --alan-tarih: #EE8C78; --alan-diger: #B9B1A4;
}
.ana-kapi .kp-aksam__sahne {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(22px, 3.2vw, 46px); border-radius: 28px; color: var(--kb-fil);
  background:
    radial-gradient(1.5px 1.5px at 12% 18%, rgba(255, 255, 255, .55), transparent 60%),
    radial-gradient(1px 1px at 27% 8%, rgba(255, 255, 255, .45), transparent 60%),
    radial-gradient(1.5px 1.5px at 46% 14%, rgba(255, 255, 255, .35), transparent 60%),
    radial-gradient(1px 1px at 63% 6%, rgba(255, 255, 255, .5), transparent 60%),
    radial-gradient(1px 1px at 71% 22%, rgba(255, 255, 255, .3), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 30%, rgba(255, 255, 255, .4), transparent 60%),
    radial-gradient(55% 70% at 0% 0%, color-mix(in srgb, var(--kb-lamba) 22%, transparent), transparent 70%),
    radial-gradient(60% 90% at 100% 0%, color-mix(in srgb, var(--birincil) 55%, transparent), transparent 72%),
    var(--kb-gece);
  box-shadow: 0 30px 60px -38px color-mix(in srgb, var(--kb-gece) 90%, transparent);
}
.ana-kapi .kp-aksam__sahne::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: var(--kb-girih); background-size: 96px 96px; opacity: .035;
}
/* Hilal: gölgeyle oyulmuş bir daire; lamba ışığıyla parlar. */
.ana-kapi .kp-aksam__hilal {
  position: absolute; top: clamp(18px, 2.6vw, 34px); right: clamp(18px, 3vw, 44px); z-index: -1;
  width: 54px; height: 54px; border-radius: 50%; transform: rotate(-24deg);
  box-shadow: inset -11px 7px 0 0 var(--kb-lamba-acik);
  filter: drop-shadow(0 0 16px color-mix(in srgb, var(--kb-lamba) 55%, transparent));
}

/* --- Baş --- */
.ana-kapi .kp-aksam__bas {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 28px;
  padding-right: 70px;
}
.ana-kapi .kp-aksam__etiket {
  display: inline-flex; align-items: center; gap: 9px; margin: 0 0 10px;
  font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--kb-lamba-acik);
}
.ana-kapi .kp-aksam__etiket::before {
  content: ""; width: 11px; height: 11px; background: var(--kb-lamba);
  -webkit-mask: var(--kb-yildiz) center / contain no-repeat; mask: var(--kb-yildiz) center / contain no-repeat;
}
.ana-kapi .kp-aksam__baslik {
  margin: 0; font-family: var(--vk-serif, var(--yz-kitap)); font-weight: 500;
  font-size: clamp(28px, 3.3vw, 46px); line-height: 1.08; letter-spacing: -.02em; color: var(--kb-fil); text-wrap: balance;
}
.ana-kapi .kp-aksam__not { margin: 10px 0 0; max-width: 60ch; font-size: 15px; line-height: 1.55; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__tumu {
  display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 0 16px; border-radius: 999px;
  box-shadow: inset 0 0 0 1px var(--kb-hat); color: var(--kb-fil); font-size: 14px; font-weight: 600; text-decoration: none;
}
.ana-kapi .kp-aksam__tumu svg { width: 16px; height: 16px; }
.ana-kapi .kp-aksam__tumu:hover { background: rgba(243, 236, 223, .08); }

/* --- Sıradaki ders --- */
.ana-kapi .kp-aksam__siradaki {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 18px 32px;
  margin: clamp(22px, 2.6vw, 34px) 0 20px; padding: 20px 24px; border-radius: 22px;
  background: linear-gradient(120deg, rgba(243, 236, 223, .08), rgba(243, 236, 223, .025));
  box-shadow: inset 0 0 0 1px var(--kb-hat);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.ana-kapi .kp-aksam__durum {
  display: inline-flex; align-items: center; gap: 8px; padding: 4px 11px 4px 9px; border-radius: 999px;
  background: color-mix(in srgb, var(--kb-lamba) 18%, transparent); color: var(--kb-lamba-acik);
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.ana-kapi .kp-aksam__durum::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.ana-kapi .kp-aksam__siradaki.is-canli .kp-aksam__durum { background: color-mix(in srgb, #3fd08a 20%, transparent); color: #7fe3b0; }
.ana-kapi .kp-aksam__siradaki.is-canli .kp-aksam__durum::before { animation: kp-aksam-nabiz 1.6s ease-out infinite; }
@keyframes kp-aksam-nabiz {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 70%, transparent); }
  100% { box-shadow: 0 0 0 9px transparent; }
}
.ana-kapi .kp-aksam__sir-ad {
  margin: 10px 0 2px; font-family: var(--vk-serif, var(--yz-kitap)); font-weight: 600; font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.15; color: var(--kb-fil);
}
.ana-kapi .kp-aksam__sir-meta { margin: 0; font-size: 14.5px; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__sayac { display: grid; gap: 6px; justify-items: start; }
.ana-kapi .kp-aksam__sayac[hidden] { display: none; }
.ana-kapi .kp-aksam__sayac-ust { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__rakamlar { display: flex; gap: 6px; }
.ana-kapi .kp-aksam__birim {
  display: grid; justify-items: center; min-width: 58px; padding: 8px 6px 6px; border-radius: 12px;
  background: rgba(0, 0, 0, .22); box-shadow: inset 0 0 0 1px var(--kb-hat);
}
.ana-kapi .kp-aksam__birim b {
  font-family: var(--vk-serif, var(--yz-kitap)); font-weight: 500; font-size: 30px; line-height: 1;
  font-variant-numeric: tabular-nums lining-nums; color: var(--kb-lamba-acik);
}
.ana-kapi .kp-aksam__birim small { margin-top: 4px; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__ilerleme { display: block; width: 100%; height: 4px; border-radius: 999px; background: rgba(243, 236, 223, .12); overflow: hidden; }
.ana-kapi .kp-aksam__ilerleme[hidden] { display: none; }
.ana-kapi .kp-aksam__ilerleme i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--kb-lamba), #7fe3b0); transition: width 1s linear; }
.ana-kapi .kp-aksam__eylem { display: flex; flex-direction: column; gap: 8px; }
.ana-kapi .kp-aksam__dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 46px; padding: 0 20px;
  border: 0; border-radius: 999px; background: var(--kb-lamba); color: #1c1000; cursor: pointer;
  font: inherit; font-size: 15px; font-weight: 700; text-decoration: none; white-space: nowrap;
  /* Gölge altın değil (1 Ekim 2026, kullanıcı: "derse git yazısı glowluyor"):
     düğmenin kendi rengindeki gölge koyu bantta hale gibi parlıyordu. */
  box-shadow: none;
  transition: transform .15s ease-out, background-color .15s ease-out;
}
.ana-kapi .kp-aksam__dugme svg { width: 17px; height: 17px; }
.ana-kapi .kp-aksam__dugme:hover { background: color-mix(in srgb, var(--kb-lamba) 85%, #fff); transform: translateY(-1px); }
.ana-kapi .kp-aksam__dugme--ikincil { background: transparent; color: var(--kb-fil); box-shadow: inset 0 0 0 1px var(--kb-hat); font-weight: 600; }
.ana-kapi .kp-aksam__dugme--ikincil:hover { background: rgba(243, 236, 223, .08); }
.ana-kapi .kp-aksam__dugme[hidden] { display: none; }

/* --- Araç çubuğu: süzgeç + takvim --- */
.ana-kapi .kp-aksam__arac { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 18px; }
.ana-kapi .kp-aksam__arac[hidden] { display: none; }
.ana-kapi .kp-aksam__suzgec { display: inline-flex; padding: 4px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--kb-hat); background: rgba(0, 0, 0, .18); }
.ana-kapi .kp-aksam__suzgec button {
  min-height: 38px; padding: 0 16px; border: 0; border-radius: 999px; background: none; cursor: pointer;
  color: var(--kb-fil-2); font: inherit; font-size: 14px; font-weight: 600;
}
.ana-kapi .kp-aksam__suzgec button[aria-pressed="true"] { background: var(--kb-fil); color: var(--kb-gece); }
.ana-kapi .kp-aksam__takvim {
  display: inline-flex; align-items: center; gap: 8px; min-height: 42px; margin-left: auto; padding: 0 16px; border: 0;
  border-radius: 999px; background: none; box-shadow: inset 0 0 0 1px var(--kb-hat); cursor: pointer;
  color: var(--kb-fil); font: inherit; font-size: 14px; font-weight: 600;
}
.ana-kapi .kp-aksam__takvim:hover { background: rgba(243, 236, 223, .08); }
.ana-kapi .kp-aksam__takvim svg { color: var(--kb-lamba-acik); }

/* --- Sekmeler (yalnız telefonda) --- */
.ana-kapi .kp-aksam__sekmeler { display: none; }

/* --- Çizelge --- */
.ana-kapi .kp-aksam__cizelge { position: relative; }
.ana-kapi .kp-aksam__eksen { display: grid; grid-template-columns: var(--gunkol) minmax(0, 1fr); margin-bottom: 6px; }
/* Eksen şeridi alacakaranlıktan (lamba) geceye koyulaşır: 20:00 ile 22:30
   arası gerçekten gün batımından geceye geçiştir. */
.ana-kapi .kp-aksam__eksen-serit {
  position: relative; height: 34px; border-radius: 999px;
  background: linear-gradient(90deg,
    color-mix(in srgb, var(--kb-lamba) 46%, var(--kb-gece)) 0%,
    color-mix(in srgb, var(--birincil) 50%, var(--kb-gece)) 48%,
    color-mix(in srgb, var(--kb-gece-2) 80%, #000) 100%);
  box-shadow: inset 0 0 0 1px var(--kb-hat);
}
.ana-kapi .kp-aksam__tik {
  position: absolute; top: 50%; left: calc(var(--k) / var(--dilim) * 100%); transform: translate(-50%, -50%);
  font-family: var(--yz-mono); font-size: 11.5px; font-variant-numeric: tabular-nums; color: color-mix(in srgb, var(--kb-fil) 70%, transparent);
}
.ana-kapi .kp-aksam__tik--saat { color: var(--kb-fil); font-weight: 600; }
.ana-kapi .kp-aksam__tik:first-child { transform: translate(10px, -50%); }
.ana-kapi .kp-aksam__tik:last-child { transform: translate(calc(-100% - 10px), -50%); }

.ana-kapi .kp-aksam__gunler { list-style: none; margin: 0; padding: 0; }
.ana-kapi .kp-aksam__gun {
  display: grid; grid-template-columns: var(--gunkol) minmax(0, 1fr); align-items: stretch;
  padding: 10px 0; border-top: 1px solid var(--kb-hat); border-radius: 14px;
}
.ana-kapi .kp-aksam__gun:first-child { border-top: 0; }
.ana-kapi .kp-aksam__gun[hidden] { display: none; }
.ana-kapi .kp-aksam__gun.is-bugun {
  background: linear-gradient(90deg, color-mix(in srgb, var(--kb-lamba) 13%, transparent), transparent 55%);
  border-top-color: transparent;
}
.ana-kapi .kp-aksam__gun.is-bugun + .kp-aksam__gun { border-top-color: transparent; }
.ana-kapi .kp-aksam__gun-ad { display: flex; flex-direction: column; justify-content: center; gap: 2px; margin: 0; padding: 0 12px; }
.ana-kapi .kp-aksam__gun-uzun { font-family: var(--vk-serif, var(--yz-kitap)); font-weight: 600; font-size: 18px; color: var(--kb-fil); }
.ana-kapi .kp-aksam__gun-ad small { font-family: var(--yz-mono); font-size: 11.5px; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__gun-ad small b { color: var(--kb-lamba-acik); font-weight: 700; }
.ana-kapi .kp-aksam__gun.is-bugun .kp-aksam__gun-uzun { color: var(--kb-lamba-acik); }
.ana-kapi .kp-aksam__gun:not(.is-bugun) .kp-aksam__bugun-yazi { display: none; }

/* Şerit: 5 dakikalık dilimler; yarım saat çizgileri zeminde. */
.ana-kapi .kp-aksam__serit {
  display: grid; grid-template-columns: repeat(var(--dilim), minmax(0, 1fr));
  grid-template-rows: repeat(var(--kulvar-say, 1), auto); row-gap: 6px; align-content: center;
  background-image: linear-gradient(90deg, var(--kb-hat) 1px, transparent 1px);
  background-size: calc(100% * 6 / var(--dilim)) 100%;
}
.ana-kapi .kp-aksam__ders {
  --acik: color-mix(in srgb, var(--rol, var(--birincil)) 82%, #fff);
  position: relative; grid-column: var(--bas) / var(--bit); grid-row: var(--kulvar, 1);
  display: flex; flex-direction: column; gap: 2px; min-width: 0; margin-right: 6px; padding: 10px 12px 11px 14px;
  border-radius: 12px; color: var(--kb-fil);
  background: linear-gradient(155deg,
    color-mix(in srgb, var(--rol, var(--birincil)) 30%, var(--kb-gece-2)),
    color-mix(in srgb, var(--rol, var(--birincil)) 12%, var(--kb-gece)));
  box-shadow: inset 3px 0 0 var(--acik), inset 0 0 0 1px color-mix(in srgb, var(--acik) 26%, transparent);
  transition: transform .18s ease-out, box-shadow .18s ease-out, opacity .3s;
}
.ana-kapi .kp-aksam__ders[hidden] { display: none; }
.ana-kapi .kp-aksam__ders:hover { transform: translateY(-2px); box-shadow: inset 3px 0 0 var(--acik), inset 0 0 0 1px color-mix(in srgb, var(--acik) 50%, transparent), 0 14px 26px -16px #000; }
.ana-kapi .kp-aksam__saat { font-family: var(--yz-mono); font-size: 12px; font-variant-numeric: tabular-nums; color: var(--acik); }
.ana-kapi .kp-aksam__saat span { color: color-mix(in srgb, var(--kb-fil-2) 80%, transparent); }
.ana-kapi .kp-aksam__ders-ad { font-size: 15px; font-weight: 600; line-height: 1.25; overflow-wrap: anywhere; }
.ana-kapi .kp-aksam__hoca { font-size: 13px; line-height: 1.35; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__hoca a { color: inherit; text-decoration: none; }
.ana-kapi .kp-aksam__hoca a:hover { color: var(--kb-fil); text-decoration: underline; text-underline-offset: 3px; }
.ana-kapi .kp-aksam__ders-not { font-size: 12.5px; font-style: italic; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__grup {
  align-self: flex-start; margin-top: 4px; padding: 1px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700;
}
.ana-kapi .kp-aksam__grup--bay { background: rgba(112, 166, 255, .18); color: #b6d2ff; }
.ana-kapi .kp-aksam__grup--bayan { background: rgba(255, 128, 170, .16); color: #ffc2d6; }
/* Durumlar (betik işaretler). */
.ana-kapi .kp-aksam__ders.is-gecti { opacity: .45; }
.ana-kapi .kp-aksam__ders.is-siradaki,
.ana-kapi .kp-aksam__ders.is-canli { box-shadow: inset 3px 0 0 var(--acik), 0 0 0 2px var(--kb-lamba-acik), 0 12px 30px -14px color-mix(in srgb, var(--kb-lamba) 70%, transparent); }
.ana-kapi .kp-aksam__ders.is-canli { box-shadow: inset 3px 0 0 var(--acik), 0 0 0 2px #7fe3b0, 0 0 28px -6px color-mix(in srgb, #3fd08a 60%, transparent); }
.ana-kapi .kp-aksam__ders.is-siradaki::after,
.ana-kapi .kp-aksam__ders.is-canli::after {
  content: var(--soz-siradaki, "Sıradaki"); position: absolute; top: -9px; right: 10px; padding: 1px 8px; border-radius: 999px;
  background: var(--kb-lamba); color: #1c1000; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
}
.ana-kapi .kp-aksam__ders.is-canli::after { content: var(--soz-canli, "Canlı"); background: #7fe3b0; color: #04311d; }

/* Şimdi çizgisi */
.ana-kapi .kp-aksam__simdi {
  position: absolute; z-index: 2; width: 2px; margin-left: -1px; pointer-events: none; border-radius: 2px;
  background: var(--kb-lamba-acik); box-shadow: 0 0 12px 1px color-mix(in srgb, var(--kb-lamba) 80%, transparent);
}
.ana-kapi .kp-aksam__simdi[hidden] { display: none; }
.ana-kapi .kp-aksam__simdi span {
  position: absolute; top: -8px; left: 50%; transform: translateX(-50%); padding: 1px 7px; border-radius: 999px;
  background: var(--kb-lamba-acik); color: #1c1000; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap;
}

/* Renk anahtarı */
.ana-kapi .kp-aksam__anahtar { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 20px 0 0; padding: 16px 0 0; list-style: none; border-top: 1px solid var(--kb-hat); }
.ana-kapi .kp-aksam__anahtar li { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--kb-fil-2); }
.ana-kapi .kp-aksam__anahtar li::before {
  content: ""; width: 10px; height: 10px; border-radius: 3px;
  background: var(--rol, var(--birincil));
}

/* --- Orta genişlik --- */
@media (max-width: 1040px) { .ana-kapi .kp-aksam { --gunkol: 112px; } .ana-kapi .kp-aksam__ders .kp-aksam__saat span { display: none; } }
@media (max-width: 1040px) and (min-width: 761px) {
  .ana-kapi .kp-aksam__siradaki { grid-template-columns: minmax(0, 1fr) auto; }
  .ana-kapi .kp-aksam__eylem { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
}

/* --- Liste düzeni: eksen 6 saatten uzunsa masaüstünde de; telefonda her zaman --- */
.ana-kapi .kp-aksam--liste .kp-aksam__eksen { display: none; }
.ana-kapi .kp-aksam--liste .kp-aksam__gunler { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.ana-kapi .kp-aksam--liste .kp-aksam__gun { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 0; background: rgba(243, 236, 223, .04); }
.ana-kapi .kp-aksam--liste .kp-aksam__gun-ad { padding: 0; }
.ana-kapi .kp-aksam--liste .kp-aksam__serit { display: flex; flex-direction: column; gap: 8px; background: none; }
.ana-kapi .kp-aksam--liste .kp-aksam__ders { margin: 0; }

@media (max-width: 760px) {
  .ana-kapi .kp-aksam__sahne { padding: 22px 16px 20px; border-radius: 22px; margin-inline: -4px; }
  .ana-kapi .kp-aksam__hilal { width: 40px; height: 40px; box-shadow: inset -8px 5px 0 0 var(--kb-lamba-acik); }
  .ana-kapi .kp-aksam__bas { padding-right: 44px; }
  .ana-kapi .kp-aksam__tumu { min-height: 40px; }
  .ana-kapi .kp-aksam__siradaki { grid-template-columns: 1fr; gap: 16px; padding: 18px 16px; margin-bottom: 16px; }
  .ana-kapi .kp-aksam__birim { min-width: 0; flex: 1 1 0; }
  .ana-kapi .kp-aksam__rakamlar { width: 100%; }
  .ana-kapi .kp-aksam__sayac { justify-items: stretch; }
  .ana-kapi .kp-aksam__birim b { font-size: 26px; }
  .ana-kapi .kp-aksam__eylem { flex-direction: row; }
  .ana-kapi .kp-aksam__eylem > * { flex: 1 1 0; padding: 0 12px; }
  .ana-kapi .kp-aksam__arac { gap: 10px; }
  .ana-kapi .kp-aksam__suzgec { width: 100%; }
  .ana-kapi .kp-aksam__suzgec button { flex: 1 1 0; padding: 0 8px; }
  .ana-kapi .kp-aksam__takvim { width: 100%; justify-content: center; margin: 0; }

  .ana-kapi .kp-aksam.is-sekmeli .kp-aksam__sekmeler:not([hidden]) {
    display: flex; gap: 6px; margin: 0 -16px 14px; padding: 2px 16px 4px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  }
  .ana-kapi .kp-aksam__sekmeler::-webkit-scrollbar { display: none; }
  .ana-kapi .kp-aksam__sekmeler button {
    flex: 1 0 58px; display: grid; justify-items: center; gap: 1px; min-height: 56px; padding: 6px 8px; border: 0; border-radius: 14px;
    scroll-snap-align: start; cursor: pointer; font: inherit; color: var(--kb-fil-2);
    background: rgba(243, 236, 223, .05); box-shadow: inset 0 0 0 1px var(--kb-hat);
  }
  .ana-kapi .kp-aksam__sekmeler button[hidden] { display: none; }
  .ana-kapi .kp-aksam__sekmeler b { font-size: 15px; font-weight: 700; color: var(--kb-fil); }
  .ana-kapi .kp-aksam__sekmeler small { font-family: var(--yz-mono); font-size: 11px; }
  .ana-kapi .kp-aksam__sekmeler button[aria-pressed="true"] { background: var(--kb-fil); box-shadow: none; }
  .ana-kapi .kp-aksam__sekmeler button[aria-pressed="true"] b,
  .ana-kapi .kp-aksam__sekmeler button[aria-pressed="true"] small { color: var(--kb-gece); }

  .ana-kapi .kp-aksam__eksen, .ana-kapi .kp-aksam__simdi { display: none !important; }
  .ana-kapi .kp-aksam__gunler { display: grid; gap: 14px; }
  .ana-kapi .kp-aksam__gun { display: block; padding: 0; border: 0; background: none !important; }
  .ana-kapi .kp-aksam.is-sekmeli .kp-aksam__gun:not(.is-secili) { display: none; }
  .ana-kapi .kp-aksam.is-sekmeli .kp-aksam__gun-ad { display: none; }
  .ana-kapi .kp-aksam__gun-ad { flex-direction: row; align-items: baseline; gap: 10px; padding: 0 0 8px; }
  /* Dikey şerit: sol kenardaki çizgi alacakaranlıktan geceye koyulaşır. */
  .ana-kapi .kp-aksam__serit {
    position: relative; display: flex; flex-direction: column; gap: 10px; padding-left: 18px; background: none;
  }
  .ana-kapi .kp-aksam__serit::before {
    content: ""; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 3px; border-radius: 3px;
    background: linear-gradient(180deg, var(--kb-lamba), color-mix(in srgb, var(--birincil) 70%, var(--kb-fil-2)) 55%, rgba(243, 236, 223, .15));
  }
  .ana-kapi .kp-aksam__ders { margin: 0; padding: 12px 14px 13px 16px; }
  .ana-kapi .kp-aksam__ders::before {
    content: ""; position: absolute; left: -18px; top: 16px; width: 11px; height: 11px; border-radius: 50%;
    background: var(--kb-gece); box-shadow: inset 0 0 0 2px var(--acik);
  }
  .ana-kapi .kp-aksam__ders .kp-aksam__saat span { display: inline; }
  .ana-kapi .kp-aksam__ders-ad { font-size: 16px; }
  .ana-kapi .kp-aksam__anahtar { gap: 8px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .ana-kapi .kp-aksam__siradaki.is-canli .kp-aksam__durum::before { animation: none; }
  .ana-kapi .kp-aksam__ders, .ana-kapi .kp-aksam__dugme { transition: none; }
  .ana-kapi .kp-aksam__ders:hover, .ana-kapi .kp-aksam__dugme:hover { transform: none; }
  .ana-kapi .kp-aksam__ilerleme i { transition: none; }
}

/* =====================================================================
 * Besmele (geçiş 165) — sayfanın ilk satırı. Hemen altındaki koyu sahneyle
 * aynı zeminde, altın harfle; iki yanında altın cetvel ve hâtem.
 * ===================================================================== */
.ana-kapi .kp-besmele {
  position: relative; padding-block: 18px 6px;
  /* Tam genişlik: .kp-serit ile aynı hile (anasayfa.css §TAM GENİŞLİK BANT). */
  margin: 0 calc(50% - 50vw); padding-inline: calc(50vw - 50%);
  display: flex; align-items: center; justify-content: center; gap: 18px;
  background: var(--birincil-koyu); color: var(--vk-altin);
}
.ana-kapi .kp-besmele span {
  font-family: var(--vk-arap); font-size: clamp(24px, 2.6vw, 32px); line-height: 1.6; font-weight: 400;
}
.ana-kapi .kp-besmele::before,
.ana-kapi .kp-besmele::after {
  content: ""; flex: 0 1 120px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--vk-altin-ince));
}
.ana-kapi .kp-besmele::after { background: linear-gradient(90deg, var(--vk-altin-ince), transparent); }

/* Sesli Kitap bandı (anasayfa/bolum-sesli.php): stili css/sesli.css'te
   ("ANA SAYFA BANDI"), sesli kitap sayfalarıyla aynı dil — 25 Eylül 2026. */

/* =====================================================================
 * 25 EYLÜL 2026 — PANELLE AYNI GECE ZEMİNİ
 * Kullanıcı: "Panelimiz çok iyi oldu. Ana sayfamızı ve diğer sayfaları da
 * baştan gözden geçirip tasarımda bütünlük sağlayalım."
 * Koyu bantlar kurum yeşilinin düz tonundaydı; panel karşılaması, iç
 * sayfaların başlık bandı ve altbilgi gece zemininde (css/kurumsal.css
 * --kb-gece-zemin). Ana sayfanın koyu bantları da aynı zemine geçti:
 * yeşil artık zemin değil, gecenin içindeki ışıma.
 * ===================================================================== */
.ana-kapi .kp-serit--koyu { background: var(--kb-gece-zemin); }
/* Slaytın hemen altındaki rakam şeridi aynı gecenin devamı: ışıma yok,
   ince saç teliyle ayrılır (panel karşılamasının gösterge şeridi gibi). */
.ana-kapi .kp-serit--koyu + .kp-serit--rakam { background: color-mix(in srgb, var(--kb-gece) 88%, #000); border-top-color: var(--kb-hat); }
.ana-kapi .kp-rakam__govde b { font-family: var(--vk-serif); font-weight: 500; font-size: clamp(26px, 2.2vw, 34px); letter-spacing: -.01em; }
.ana-kapi .kp-rakam__ikon { background: rgba(243, 236, 223, .06); box-shadow: inset 0 0 0 1px var(--kb-hat); }
/* İletişim şeridi ve program kutusu: düz yeşil blok yerine gece kartı. */
.ana-kapi .kp-iletisim { background: var(--kb-gece-zemin); }
/* Kapanış bandı altbilgiye yapışsın: arada kâğıt rengi şerit kalmasın. */
main.ana-kapi { padding-bottom: 0; }
/* Besmele şeridi gecenin kendisinde; altındaki sahneden ince bir saç teliyle
   ayrılır (sahnenin ışıması şeridin içine taşmasın, dikiş görünmesin). */
.ana-kapi .kp-besmele { background: var(--kb-gece); padding-block: 14px 12px; border-bottom: 1px solid var(--kb-hat); }

/* =====================================================================
 * 29 EYLÜL 2026 — AÇILIŞ SLAYTI TELEFONDA
 * Kullanıcı (telefon ekran görüntüsüyle): "Slider banner mobile uygun değil."
 * 412 px'te ölçülen: bölüm 780 px boyundaydı; kumanda üç satıra dağılıyordu
 * (noktalar, altında duraklat, en altta oklar); 430 px'lik madalyon ve
 * üstüne binen iki rakam kartı, hemen alttaki rakam şeridinin tekrarıydı;
 * slaytların boyu farklı olduğu için her geçişte sayfa zıplıyordu; besmele
 * iki satıra, künye satırı da iki satıra bölünüyordu.
 * ===================================================================== */
@media (max-width: 719px) {
  /* Besmele tek satır: yan cetveller kısalır, harf küçülür. */
  .ana-kapi .kp-besmele { gap: 10px; padding-block: 10px 8px; }
  .ana-kapi .kp-besmele span { font-size: 22px; line-height: 1.5; white-space: nowrap; }
  .ana-kapi .kp-besmele::before,
  .ana-kapi .kp-besmele::after { flex-basis: 44px; }

  .ana-kapi .kp-slider { padding-top: 28px; }
  .ana-kapi .kp-slayt { gap: 22px; }
  .ana-kapi .kp-slayt__etiket { font-size: 11.5px; letter-spacing: .12em; gap: 8px; margin-bottom: 12px; }
  .ana-kapi .kp-slayt__etiket::before { width: 10px; height: 10px; }
  .ana-kapi .kp-slayt__baslik { font-size: clamp(29px, 8.2vw, 36px); line-height: 1.12; }
  .ana-kapi .kp-slayt__alt { font-size: 16px; line-height: 1.6; margin-top: 12px; }
  .ana-kapi .kp-serit--koyu .kp-slayt__dugme { margin-top: 20px; min-height: 50px; }

  /* Görsel telefonda da büyük (5 Ekim 2026, kurum isteği: 250 → 320 px). */
  .ana-kapi .kp-slayt__gorsel { padding: 0; }
  .ana-kapi .kp-slayt__gorsel--daire img,
  .ana-kapi .kp-slayt__gorsel--kare img { max-width: min(320px, 78vw); }
  .ana-kapi .kp-slayt__gorsel--afis img { max-width: min(250px, 62vw); }
  .ana-kapi .kp-slayt__gorsel--daire .kp-sahne__halka { width: min(362px, 88vw); }
}

/* Tek sütunlu düzen 1023 px'e kadar sürüyor (anasayfa.css §23): sabit boy ve
   tek satır kumanda tablette de geçerli. 768 px'te ok, görselin üstündeki
   rakam kartına biniyordu. */
@media (max-width: 1023px) {
  /* Alt dolgu kumanda şeridine yer açar (en çok 52 px ok + 20 px kenar + 12 px nefes). */
  .ana-kapi .kp-slider { padding-bottom: 84px; }
  /* SABİT BOY: betik varken slaytlar aynı ızgara hücresine yığılır, gizli
     olanlar yer kaplamaya devam eder (görünmez); şerit en uzun slayt
     boyunda sabit kalır ve geçişte alttaki içerik zıplamaz. Betiksiz
     tarayıcıda ray eskisi gibi yatay kaydırılır (.kp-slider--js yok). */
  .ana-kapi .kp-slider--js .kp-slider__ray { display: grid; overflow: visible; }
  .ana-kapi .kp-slider--js .kp-slayt { grid-area: 1 / 1; align-content: start; }
  .ana-kapi .kp-slider--js .kp-slayt[hidden] { display: grid; visibility: hidden; }

  /* KUMANDA TEK SATIR, bölümün dibinde: ‹  • • •  ›
     Seçiciler `.kp-slider >` ile: `.kp-blok > :not(.kp-dekor)` konum kuralını
     ancak böyle ezer (anasayfa.css §8'deki not). */
  .ana-kapi .kp-slider > .kp-slider__ok { top: auto; bottom: 20px; }
  .ana-kapi .kp-slider > .kp-slider__ok--geri { left: 16px; }
  .ana-kapi .kp-slider > .kp-slider__ok--ileri { right: 16px; }
  .ana-kapi .kp-slider > .kp-slider__noktalar {
    position: absolute; z-index: 3; left: 50%; bottom: 33px; transform: translateX(-50%); margin: 0;
  }
}

/* =====================================================================
 * TELEFONDA KISA ANA SAYFA (29 Eylül 2026)
 *
 * 375 px'te sayfa 19.031 px idi (23 ekran). En uzun üç bölüm kartlarını tek
 * sütunda alt alta diziyordu: kurslar 3.885, hocalar 2.235, yol haritası
 * 1.334 px. 640 px altında üçü de YATAY RAYA döner (sözler bölümündeki
 * .kp-kaydir diliyle aynı): kart ekranın %80'i, bir sonrakinin ucu görünür,
 * parmakla kayar, scroll-snap ile oturur. İçerik kaybolmaz, yalnız yön değişir.
 *
 * Ray içerik hizasında durur, sayfa kenarına TAŞMAZ: taşırıldığında
 * scroll-padding yüzdesi rayın kendi genişliğine göre hesaplanıyor ve ilk
 * kart ekranın soluna yapışıyordu; iç içe kaplardan gelen kenar boşluğu
 * CSS'te tek bir değişkene bağlanamıyor.
 * Kaydırma çubuğu ince ve görünür kalır: betik yokken kaydırılabildiğinin
 * işaretlerinden biri (bkz. §15 .kp-kaydir).
 * ===================================================================== */
@media (max-width: 639px) {
  .ana-kapi :is(.kp-kurslar, .kp-hocalar) .kp-dizi,
  .ana-kapi .dizin {
    display: flex; gap: 14px;
    overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    padding: 4px 2px 16px;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--murekkep) 24%, transparent) transparent;
  }
  .ana-kapi :is(.kp-kurslar, .kp-hocalar) .kp-dizi > li {
    flex: 0 0 80%; min-width: 0; scroll-snap-align: start; display: flex;
  }
  .ana-kapi :is(.kp-kurslar, .kp-hocalar) .kp-dizi > li > * { width: 100%; }

  /* Yol haritası: tek çerçeveli liste beş ayrı adım kartına ayrılır. */
  .ana-kapi .dizin {
    background: none; border: 0; border-radius: 0; box-shadow: none; overflow-y: hidden;
  }
  .ana-kapi .dizin .dizin-satir {
    flex: 0 0 80%; min-width: 0; scroll-snap-align: start;
    display: flex; flex-direction: column;
    border: 1px solid var(--cizgi); border-radius: 14px; background: var(--yuzey);
  }
  .ana-kapi .dizin .dizin-satir p { flex: 1; margin-bottom: 12px; }

  /* Tanıtımın ikinci, uzun paragrafı (üniversitenin kuruluşu, lisans
     süreçleri) telefonda ~350 px tutuyordu. Özet cümle başlığın altında
     kalır, ayrıntı bir dokunuş ötede: "Hakkımızda" düğmesi. */
  .ana-kapi .kp-tanitim__metin { display: none; }

  /* OKULLAR: ana giriş kapısı olduğu için raya dönmez, sekiz okul ilk
     bakışta görünür kalır. Kartlar (anasayfa.css §10) telefonda iki
     sütun ve kısa şeritli; açıklama cümlesi gizli (başlık ve "Hepsini gör" yeter). */
  .ana-kapi .kp-okullar .kp-bas__alt { display: none; }
  .ana-kapi .kp-okullar .kp-okul-grup + .kp-okul-grup { margin-top: 22px; }

  /* Bölüm nefesi telefonda biraz daralır: 16 bölüm × iki kenar. */
  .ana-kapi { --kp-nefes-orta: 40px; --kp-nefes-genis: 56px; }
}

/* ---------- Rakam şeridi tek satırda (30 Eylül 2026) ----------
   Kullanıcı: "bu altta yazan istatistikleri mobilde tek satıra al". Şerit
   telefonda 2 sütunlu ızgaraya dökülüyor, beş sayı üç satır (~700 px)
   tutuyordu; 5. sayı da tek başına kalıyordu. Artık her genişlikte tek satır:
   sayı kadar eşit sütun (sayaç sayısı veriden, 4 ya da 5 olabilir). Tablet
   genişliğinde simge kalır; telefonda simge düşer, sayı ile etiket alt alta
   ortalanır, sütunları altın saç teli ayırır. */
@media (max-width: 1119px) {
  .ana-kapi .kp-rakamlar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  /* Tablette beş hücre ~142 px: simge ve boşluklar daralır ki "2.142 ünite" sığsın. */
  .ana-kapi .kp-rakam { gap: 10px; padding-inline: 12px; }
  .ana-kapi .kp-rakam:first-child { padding-left: 0; }
  .ana-kapi .kp-rakam__ikon { width: 36px; height: 36px; }
  .ana-kapi .kp-rakam__ikon svg { width: 19px; height: 19px; }
}
@media (max-width: 719px) {
  .ana-kapi .kp-rakam,
  .ana-kapi .kp-rakam + .kp-rakam {
    flex-direction: column; justify-content: flex-start; gap: 0; min-width: 0;
    margin-top: 0; padding: 2px 4px; text-align: center;
    border-top: 0; border-left: 1px solid var(--vk-altin-ince);
  }
  .ana-kapi .kp-rakam:first-child { border-left: 0; }
  .ana-kapi .kp-rakam__ikon { display: none; }
  .ana-kapi .kp-rakam__govde { min-width: 0; }
  .ana-kapi .kp-rakam__govde b { font-size: clamp(17px, 5.4vw, 23px); letter-spacing: -.02em; white-space: nowrap; }
  .ana-kapi .kp-rakam__govde > span { margin-top: 2px; font-size: 11.5px; letter-spacing: .02em; }
}