/* Randevu Atolye — siteye özel tasarım
 *
 * BURASI BAŞLANGIÇ NOKTASI. Tasarımı buradan yaz; iskeletin nötr hali
 * altta duruyor ve yalnız EZDİĞİN kurallar değişiyor.
 *
 * ÜÇ KURAL (hepsi canlıda hata verdiği için yazıldı)
 * 1. Sınıf adları İSKELETİN ÜRETTİĞİ adlardır: ki-kart, ki-izgara, ki-alan,
 *    ki-girdi, ki-telif… Uydurulmuş ada yazılan kural sessizce hiçbir şeye
 *    uygulanmaz ve tema "çalışıyor" görünüp çıplak render edilir.
 *    Gerçek adları görmek için: themes/_iskelet/blocks/*.html
 * 2. Her yerde LOGICAL property (margin-inline, border-inline-start,
 *    inset-inline). Site bir gün Arapça'ya açılırsa dir="rtl" altında
 *    hiçbir şey değiştirmeden doğru çalışır.
 * 3. Bir bölümü KOYU yaparsan iskeletin oraya verdiği açık zemini ve koyu
 *    metin rengini AÇIKÇA ez (aşağıdaki bloğa bak). Tek tek ezme; bölümün
 *    içindeki her şeyi tek kuralla devral.
 */

/* ── Koyu bölümler: iskeletin açık-zemin varsayımını devral ───────────────── */
/* İskelet .ki-cta-ic'e açık kum zemini, .ki-telif ve .ki-altbilgi-slogan'a
   koyu gri renk verir. Bölümü koyu yapınca beyaz metin açık kutunun üstüne
   düşer (ölçüldü: 1.18:1). Bu blok o tuzağı baştan kapatır. */
.ki-cta-serit { background: var(--ki-renk-marka); color: #fff; }
.ki-cta-ic { padding: 0; background: transparent; border: 0; }
.ki-cta-baslik, .ki-cta-aciklama { color: #fff; }

.ki-altbilgi { background: var(--ki-renk-marka-koyu); }
.ki-altbilgi, .ki-altbilgi * { color: rgba(255, 255, 255, .74); }
.ki-altbilgi-ad { color: #fff; }
.ki-altbilgi a { color: rgba(255, 255, 255, .86); }
.ki-altbilgi a:hover { color: #fff; }

/* ── Düğme: rengini ZEMİNDEN DEĞİL kendinden alır ─────────────────────────── */
/* Zemine güvenmek bir kez koyu üstünde koyu metin üretti (okunmuyordu). */
.ki-dugme-birincil { background: var(--ki-renk-vurgu); color: #fff; }
.ki-hero .ki-dugme-sessiz, .ki-cta-serit .ki-dugme-sessiz {
  background: transparent; color: #fff; border-color: rgba(255, 255, 255, .42);
}

/* ── Okuma sütunu sola yaslı kalsın ───────────────────────────────────────── */
/* `.ki-dar`a doğrudan dar max-width vermek `.ki-kap`ın margin auto'suyla
   birleşip bloğu ortalar; diğer bölümler sola hizalıyken hiza omurgası
   kırılır (ölçüldü: 1440px'te 253px kayma). */
.ki-kap.ki-dar { max-width: var(--ki-kap-genislik); }
.ki-kap.ki-dar > * { max-width: 74ch; }

/* ── iOS: form alanı 16px altına düşerse odaklanınca sayfa zorla yakınlaşır ─ */
.ki-girdi { font-size: 1rem; }

/* ── Dokunmatik: her hedef en az 44px ─────────────────────────────────────── */
@media (pointer: coarse) {
  .ki-menu-oge > a, .ki-link, .ki-kart-link {
    min-height: 44px; display: inline-flex; align-items: center;
  }
}

/* ═══ BURADAN İTİBAREN SİTENİN KENDİ TASARIMI ═══════════════════════════════
   Hero, tipografi, ızgara, kart, renk vurguları… Bu bölüm her sitede
   TAMAMEN farklı olmalı; aynı elden çıkmış hissi vermemeli. */