/* Çözen Zeka tanıtım sitesi teması.
 *
 * TÜRETİLMİŞ KOPYA — KAYNAK DEĞİL. kararlar/0030: tema kaynağı `web-app/src/tema.css`.
 * Aşağıdaki `:root` bloğu ORADAN kopyalandı (34 token). Bir değer değişecekse ÖNCE orada
 * değişir, sonra buraya taşınır. Burada değişen bir değer geçersizdir.
 *
 * Ölçüldü 31.08.2026: web-app/src/tema.css'in `:root` bloğu 41 satır / 34 token; bu dosya
 * onun birebir kopyasını taşıyor. Bileşen kuralları (.dugme, .kart, .rozet ve ötekiler,
 * ~720 satır) KOPYALANMADI — bu site onlara ihtiyaç duymuyor, iki sayfası kendi düzenini
 * kuruyor.
 *
 * kararlar/0030 elle senkronizasyonu bilinçli seçmiş ve otomatik mekanizmanın tetiğini
 * yazmış: "renkler ikinci kez elle senkronlanmak zorunda kaldığında". O tetik BU DOSYADAN
 * ÖNCE ateşlenmişti (video-engine/remotion/src/tema.ts iki kez senkronlandı) ve mekanizma
 * kurulmadı. Bu dosya ÜÇÜNCÜ tüketici; borç kararlar/0056'nın `Sonucu` bölümünde yazılı.
 *
 * YAZI TİPİ: `--yazi-tipi` hâlâ Nunito diyor ve bu KAYNAKTAKİ HÂLİYLE kopyalandı.
 * kararlar/0039 yazı tipini GEORAMA'ya çevirdi ama hiçbir yerde uygulanmadı — ölçüldü,
 * web-app da hiçbir yazı tipi yüklemiyor. Georama kendi barındırmayla geldiğinde iki yer
 * birden düzelir. BURAYA GOOGLE FONTS LİNKİ EKLENMEZ: kararlar/0056 madde 6 ve gizlilik
 * politikası, sayfada HİÇBİR üçüncü taraf isteği olmadığı üzerine kurulu.
 */

/* ── web-app/src/tema.css'ten birebir kopya ─────────────────────────────────── */
:root {
  --zemin: #FCF8F1;          /* sıcak krem ekran zemini */
  --zemin-koyu: #F4ECDD;     /* ikincil düğme, ikinci düzey zemin */
  --cizgi: #E6DCC8;          /* kenarlık, ayırıcı */
  --metin: #1E2A44;          /* lacivert ana metin */
  --metin-solgun: #4A5367;   /* ikincil metin, etiket -- 0039 madde 6 */
  --koyu-solgun: #6E7A97;    /* KOYU yuzeyde sonuk isaret ve kenarlik */
  --mavi: #2563EB;           /* birincil eylem -- 0039/brief */
  --mavi-acik: #E8EFFF;
  --amber: #F2A31A;          /* vurgu, bekleme */
  --amber-koyu: #C97F06;
  --amber-acik: #FFF3DC;
  --yesil: #15803D;          /* başarı, hazır -- 0039 madde 8 */
  --yesil-acik: #E1F7EC;
  --kirmizi: #DC2626;        /* hata -- 0039 madde 8 */
  --kirmizi-acik: #FEE9E7;
  --mor: #7A5AF8;            /* ikincil vurgu */
  --mor-acik: #EFEBFF;
  --beyaz: #FFFFFF;

  --yazi-tipi: Nunito, "Segoe UI", system-ui, sans-serif;
  --yazi-tipi-mono: ui-monospace, "Segoe UI Mono", Menlo, monospace;

  --yazi-dev: 28px;    /* cocuk basligi */
  --yazi-buyuk: 20px;  /* cocuk metni / veli basligi */
  --yazi-orta: 18px;
  --yazi-normal: 15px; /* veli metni */
  --yazi-kucuk: 13px;

  --dokunma-hedefi: 56px;
  --dokunma-araligi: 64px;
  --bosluk-dar: 8px;
  --bosluk: 16px;
  --bosluk-genis: 28px;
  --yuvarlak: 16px;
  --yuvarlak-tam: 999px;

  --golge: 0 2px 8px rgba(30, 42, 68, 0.08);
  --golge-yuksek: 0 8px 28px rgba(30, 42, 68, 0.14);
}

/* ── Buradan aşağısı BU SİTEYE ait, web-app'te karşılığı yok ────────────────── */

*, *::before, *::after { box-sizing: border-box; }

html {
  /* Telefon tarayıcısı birincil (kararlar/0013). Yakınlaştırma kısıtlanmıyor. */
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font-family: var(--yazi-tipi);
  font-size: var(--yazi-orta);
  line-height: 1.6;
}

/* Okuma genişliği: uzun satır telefonda da masaüstünde de yorucu. */
.kabuk {
  max-width: 44rem;
  margin: 0 auto;
  padding: var(--bosluk-genis) var(--bosluk);
}

/* ── Manşet ─────────────────────────────────────────────────────────────────── */

.manset {
  padding: var(--bosluk-genis) 0;
  border-bottom: 1px solid var(--cizgi);
}

.marka {
  font-size: var(--yazi-normal);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--metin-solgun);
  margin: 0 0 var(--bosluk-genis);
}

.manset h1 {
  font-size: var(--yazi-dev);
  font-weight: 900;
  line-height: 1.25;
  text-wrap: balance;
  margin: 0 0 var(--bosluk);
}

.manset-alti {
  font-size: var(--yazi-buyuk);
  color: var(--metin-solgun);
  margin: 0;
}

/* ── Bölümler ───────────────────────────────────────────────────────────────── */

.bolum {
  padding: var(--bosluk-genis) 0;
  border-bottom: 1px solid var(--cizgi);
}

/* DOGRUDAN COCUK (`>`) DEGIL, TORUN. Ilk surum `.bolum > h2` yaziyordu ve `.durum` icindeki
   baslik kuralin DISINDA kaliyordu: `.bolum > .durum > h2` zinciri `>` ile eslesmiyor.
   Olculdu (gorunum kosumu, 390px): uc bolum basligi 20px, "Su an ne durumda" 27px — tarayici
   varsayilani (1.5em). Sayisal kontroller bunu GORMEDI (tasma yok, metin 13px alt sinirinin
   ustunde, sifir konsol hatasi); yalniz ekran goruntusune BAKINCA cikti. */
.bolum h2 {
  font-size: var(--yazi-buyuk);
  font-weight: 800;
  margin: 0 0 var(--bosluk);
}

.bolum p { margin: 0 0 var(--bosluk); }
.bolum p:last-child { margin-bottom: 0; }

/* ── Adımlar: numara GERÇEK bir sıra taşıdığı için numaralı ─────────────────── */

.adimlar {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--bosluk-genis);
  counter-reset: adim;
}

.adim { counter-increment: adim; }

.adim h3 {
  display: flex;
  align-items: baseline;
  gap: var(--bosluk-dar);
  font-size: var(--yazi-orta);
  font-weight: 800;
  margin: 0 0 var(--bosluk-dar);
}

.adim h3::before {
  content: counter(adim);
  flex: 0 0 auto;
  min-width: 1.6em;
  padding: 0 0.4em;
  border-radius: var(--yuvarlak-tam);
  background: var(--mavi-acik);
  color: var(--mavi);
  font-size: var(--yazi-normal);
  font-weight: 900;
  text-align: center;
}

.adim p {
  margin: 0;
  color: var(--metin-solgun);
}

/* ── Durum kutusu: ürün henüz yayında değil ─────────────────────────────────── */

.durum {
  background: var(--amber-acik);
  border: 1px solid var(--amber);
  border-radius: var(--yuvarlak);
  padding: var(--bosluk-genis) var(--bosluk);
}

.durum h2 { margin-top: 0; }

/* ── Bağlantılar ────────────────────────────────────────────────────────────── */

a {
  color: var(--mavi);
  text-decoration: underline;
  text-underline-offset: 2px;
}

a:hover { text-decoration-thickness: 2px; }

a:focus-visible {
  outline: 3px solid var(--mavi);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Dokunma hedefi: e-posta bağlantısı telefonda parmakla basılabilir olmalı. */
.eposta {
  display: inline-flex;
  align-items: center;
  min-height: var(--dokunma-hedefi);
  font-size: var(--yazi-buyuk);
  font-weight: 800;
}

/* ── Alt bilgi: şirket bilgisi ZORUNLU (kararlar/0045, UK mevzuatı) ─────────── */

.alt {
  padding: var(--bosluk-genis) 0;
  color: var(--metin-solgun);
  font-size: var(--yazi-normal);
}

.alt p { margin: 0 0 var(--bosluk-dar); }
.alt p:last-child { margin-bottom: 0; }
.alt strong { color: var(--metin); }

.alt-baglar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bosluk);
  margin-bottom: var(--bosluk);
}

/* ── Gizlilik sayfası ───────────────────────────────────────────────────────── */

.geri {
  display: inline-block;
  margin-bottom: var(--bosluk-genis);
  font-size: var(--yazi-normal);
  font-weight: 700;
}

.politika h1 {
  font-size: var(--yazi-dev);
  font-weight: 900;
  line-height: 1.25;
  margin: 0 0 var(--bosluk-dar);
}

.guncelleme {
  color: var(--metin-solgun);
  font-size: var(--yazi-normal);
  margin: 0 0 var(--bosluk-genis);
}

.politika h2 {
  font-size: var(--yazi-buyuk);
  font-weight: 800;
  margin: var(--bosluk-genis) 0 var(--bosluk);
}

.politika p { margin: 0 0 var(--bosluk); }

.politika ul {
  margin: 0 0 var(--bosluk);
  padding-left: 1.4em;
}

.politika li { margin-bottom: var(--bosluk-dar); }

/* ── Hareket tercihi ────────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}