/* ══════════════════════════════════════════════════════════════════════
   ob-video-uyum.css — SİTE GENELİ TEK RENK ZEMİN + uyum katmanı
   6 Ağustos 2026.

   ⚠ DOSYA ADI ESKİ. İçinde artık video yok; zemin tek renk. Ad 42 dosyada
   geçtiği için değiştirilmedi — hepsine dokunmaya değmezdi.

   Bilo'nun kararı:
     "sitede arka plan tek renk olsun. hem pcde hem telefonda bütün sitenin
      arka planı tek renk olacak. aşırı koyu veya aşırı açık bi renk seçme
      orta karar bir şey olsun ve sırıtmasın marka kimliğiyle.
      şeffaflık kalacak yine."

   RENK: #12100E — siyaha yakın, çok az sıcak.
     Eski video zeminin 697 karesi ölçüldü: ortalama #571000, parlaklık %12,
     doygunluk %100. Aşırı koyu VE sırıtan bir kırmızıydı. Yeni renk
     parlaklığı %6,4'te tutuyor — Bilo ilk denenen %19'luk tonu beğenmedi, siyaha yakın istedi. Sıcak tarafta
     kalıyor. Beyaz metinle kontrast 19:1, turuncu vurguyla 6,6:1.
   ══════════════════════════════════════════════════════════════════════ */

/* ── ZEMİN ─────────────────────────────────────────────────────────────
   Tek kaynak burası. Sayfaların kendi koyu tema zeminlerini eziyor;
   `!important` bilerek kullanıldı çünkü 40'tan fazla sayfa kendi
   `body{background:...}` kuralını yazıyor ve hepsine tek tek dokunmak
   yerine tek noktadan yönetiliyor. */
html,body{
  background:#12100E !important;
  background-image:none !important;
}

/* Eski zemin öğeleri: video, WebGL tuvalleri, karartma katmanı.
   js/ob-zemin.js bunları DOM'dan söküyor; bu kurallar betik yetişene
   kadar (veya çalışmazsa) ekranda görünmemelerini garantiliyor. */
#obVideo,#plasma,#obZemin,#bg-canvas,#plasmaBlur{display:none !important}

/* ── Kart aileleri — DARALTILDI ────────────────────────────────────────
   İlk yazımda `.kart, .card, .panel, .kutu, .box` gibi GENEL adlar
   `!important` ile hedeflenmişti. Bu adlar sitede kutu olmayan öğelerde de
   kullanılıyor ve üç kritik akışı bozdu:

     register.php:323          → KVKK/şartlar ONAY KUTUSU işaretlenince
                                 dolmuyordu (şeftali dolgu eziliyordu)
     kurumsal-hesap-ac.php:297 → sözleşme MODALI saydamlaşıyor, arkasındaki
                                 metinle üst üste biniyordu
     profil-duzenle.php:317    → KVKK onay göstergesi onaylı/onaysız
                                 ayırt edilemez hâle geliyordu
     obai-asistan.php:480      → dosya bırakma alanının turuncu kesikli
                                 çerçevesi soluk beyaza dönüyordu
     sifremi-unuttum / yeni-sifre / hesap-guvenligi → `.card` bu sayfalarda
                                 formun ana gövdesi; kendi zeminini kaybediyordu

   Ders: site geneline GENEL sınıf adlarıyla `!important` yazma. Ne
   hedeflediğini bilmiyorsan hedefleme. Kutular kendi tanımlarında kalıyor.

   ── Form alanları — DOKUNULMUYOR ──────────────────────────────────────
   Buraya girdi kutularını camlaştıran bir kural yazılmıştı ve
   register.php'de formu BOZDU: Ad Soyad ile E-posta alanları üst üste
   bindi, yer tutucu metin sağa kaydı. Kayıt akışı sitenin en kritik
   yolu; görsel uyum için onu riske atmaya değmez. */

/* ── Okunurluk ─────────────────────────────────────────────────────────
   Koyu temada %35-45 opaklıkla yazılan yardımcı metinler zemin
   açıldığında kayboluyordu. Aşağıdaki alt sınır bütün sayfalarda geçerli. */
.hint,small{color:rgba(255,255,255,.80)}

/* Site soluk metni `--sonuk` / `--muted` DEĞİŞKENİYLE veriyor (818 yerde),
   sınıf adıyla değil. İlk yazımdaki `.muted,.sonuk,.soluk,.yardim` seçicileri
   sitede hiç kullanılmıyordu — kural ölüydü. Değişkenin kendisini
   yükselterek tek hamlede hepsini okunur yapıyoruz. */
:root{
  --sonuk:rgba(255,255,255,.82);
  --muted:rgba(255,255,255,.82);
  --z-blur:0px;          /* eskiden kaydırma bulanıklığıydı; artık sabit 0 */

  /* ── ZEMİN DEĞİŞKENİ — 7 Ağu 2026 ──────────────────────────────────
     Bilo: "telefonla bilgisayar sayfalarının rengi aynı değil."
     Sebep bulundu: html/body her yerde #12100E (yukarıdaki !important
     kuralı sayesinde), AMA `--bg` değişkeni masaüstü ve kurumsal
     sayfalarda #08080b, telefon sayfalarında #12100E kalmıştı.
     Yapışkan başlıklar (.pd-top), kenarlıklar, tuval zeminleri bu
     değişkeni okuduğu için iki taraf farklı görünüyordu — fark
     gözle seçilebilecek kadar büyük (parlaklık %3,1 ↔ %6,4).

     Tek noktadan eşitleniyor. `!important` şart: sayfaların kendi
     `<style>` blokları bu dosyadan SONRA geldiği için normalde
     onlar kazanır. Özel değişkenlerde de !important geçerlidir. */
  --bg:#12100E !important;
  --bg-soft:#1a1713 !important;   /* bir tık açık kardeşi (kart/panel zemini) */
  --canvas-bg:#12100E !important;
}

/* Yatay kayma kilidi — 6 Ağu 2026.
   Sabit konumlu zemin öğesi belge genişliğine katılıp telefonda sayfayı
   yana kaydırıyordu. Zemin öğesi artık yok ama kilit ikinci güvence
   olarak kalıyor; sayfaların kendi genişlik hesabını bozmuyor. */
html,body{overflow-x:hidden}

/* ══ DAR EKRANDA TAŞMA KORUMASI (6 Ağu 2026) ═════════════════════════
   phone-index'te hero başlığı ekrana sığmıyordu: "OrtakBurada." tek
   kelime, bölünemiyor ve vw tabanlı font boyutuyla satır ekranı aşıyordu.
   Sonuç: sayfanın tamamı yana kayıyor, bütün metinler sağdan kesiliyordu.

   Aynı kalıp 12 telefon sayfasında daha var (vw tabanlı büyük başlık).
   Tek tek ölçmek yerine buraya genel bir kural konuyor: dar ekranda uzun
   kelimeler gerekiyorsa bölünsün, hiçbir başlık ekranı taşırmasın.

   `anywhere` seçildi (`break-word` değil): break-word yalnızca başka
   çare kalmadığında bölerken, anywhere satır hesabına da katılıyor —
   yani kutu genişliği baştan doğru hesaplanıyor. */
@media(max-width:560px){
  h1,h2,h3,
  .h-title,.hero-title,.sy-bas,.pd-bas,
  [class*="title"],[class*="baslik"],[class*="bas-"]{
    overflow-wrap:anywhere;
    word-break:normal;      /* Türkçe sözcükleri gereksiz yerden bölmesin */
  }
  /* Genişliği JavaScript ile piksel olarak verilen kutular (dönen kelime
     gibi) ekranı aşamasın. */
  .rot-box,[id*="rotBox"]{max-width:100% !important;overflow:hidden}
}

/* Karşılaştırma tablosu dar ekranda taşıyordu: `min-width:560px` var ama
   dengeleyen bir kaydırma yok, en dar telefon 320px. Modal içinde yatay
   kaydırma açılıyor ve tablo dar ekranda kendi genişliğine düşüyor. */
@media(max-width:600px){
  .cmp-ov table.cmp-tbl{min-width:0}
  .cmp-ov .cmp-kutu,.cmp-ov > div{overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* ══ PERFORMANS ════════════════════════════════════════════════════════
   6 Ağu 2026 — Bilo: "site çok ağır, keşfet ve mağaza sayfalarında kasıyor."

   Ölçüm: mağazada 44, keşfette 23 `backdrop-filter` kullanımı vardı. Arkada
   sürekli oynayan bir video olduğu için HER VİDEO KARESİNDE bu yüzeylerin
   hepsi yeniden hesaplanıyordu. Asıl maliyet buydu ve video kalkınca gitti:
   sabit bir rengin üstündeki cam yüzeyi tarayıcı bir kez hesaplayıp
   saklayabiliyor.

   Bu yüzden telefonda blur'u kapatan kural KALDIRILDI — Bilo'nun
   "şeffaflık kalacak yine" şartı hem masaüstünde hem telefonda geçerli.

   `content-visibility` kalıyor: tarayıcıya "bu bölüm ekranda değilse hiç
   uğraşma" diyor, uzun sayfalarda kazanç hâlâ büyük. */
.bol,.hikaye,.adim,.guven-k,.ekran,.taraf,.terim{
  content-visibility:auto;
  contain-intrinsic-size:auto 320px;
}
