/* ONY Creative, tasarım tokenları. Renk, tipografi, boşluk ve köşe kuralının tek kaynağı.
   Kural: aksan rengi yok; sayfadaki tek renk işlerin kendisinden gelir.
   Sayfa açık zeminde kurulu; yalnız işler bölümü koyu, o bölüm bu değişkenlerin
   koyu karşılıklarını kendi içinde geçersiz kılar (bkz. main.css .isler). */

:root {
  /* ---- Açık yüzeyler ---- */
  --zemin:   #fbfaf7; /* sedef beyazı: saf beyazın dört birim altında. FF'e yakın ama FF değil;
                         saf beyaz ekranda kâğıt değil ışık gibi duruyor ve ürün fotoğraflarının
                         beyaz fonuyla tamamen kaynaşıyordu. R ile B arası 4 birim, sarıya kaçmaz.
                         Mürekkeple kontrastı 16.4, ikincil metinle 6.2.
                         Üstüne ince bir tane dokusu biniyor (bkz. --doku). */
  --panel:   #f2f1ee; /* zeminin bir ton koyusu: 2, 4 ve 6. bölümler bununla ayrılıyor.
                         Aradaki fark 9 birim; sınır belli oluyor ama sayfayı bölmüyor.
                         İkincil metinle kontrastı 5.71, bağlantıyla 6.11.
                         Aynı değer çerçeve içi ve adres hapı gibi küçük yüzeylerde de. */
  --kart:    #d9d6cf; /* üçüncü kademe, açık temada nadiren gerekiyor */
  --ayrac:   #d6d3cc; /* çizgiler: zeminle kontrastı 1.43, yalnız yapıyı belli eder */

  /* ---- Açık zemin metinleri ---- */
  --metin:   #1f1b18; /* sıcak mürekkep, saf siyah değil; zeminle 16.4 kontrast */
  --metin-2: #655d56; /* sıcak gri. Zeminle 6.18, panelle 5.71: ikisi de AA sınırının üstünde.
                         Bir tık açığı (#6b635c) eski panel üstünde 4.42'ye düşüyordu. */

  /* ---- Tek işlevsel renk: yalnız bağlantı ve odak, dekorasyonda kullanılmaz ---- */
  --baglanti: #7d5024; /* sıcak koyu tarçın; açık zeminle 6.61 kontrast */

  /* ---- Koyu yüzeyler. Artık koyu bir BÖLÜM yok: işler bölümü de açık zeminde.
          Bunlar üst barın camı ve fotoğrafların üstündeki yazı için duruyor. ---- */
  --koyu-zemin:    #17120f; /* saydamlık azaltılmışsa barın düz karşılığı */
  --koyu-metin:    #f0ebe4; /* kâğıt beyazı, saf beyaz koyu zeminde parlıyor */
  --koyu-metin-2:  #a99d91; /* fotoğraf üstünde ikincil satır */

  /* Üst bar kendi iki değerini taşıyor. 2026-09-02: koyu camdan açık cama
     geçildi (#D8D4C9, ayracın kılpayı açığı) — sayfada gerçek koyu bölüm
     kalmadığı için koyu bar tek ağır bant olarak kalmıştı. Sedef üstünde
     ~#e0dcd1'e denk düşüyor; mürekkep metinle kontrast 12:1'in üstünde,
     kaydırmada en koyu fotoğrafın üstünde bile 6.5:1'in altına inmiyor. */
  --bar-zemin: rgba(216, 212, 201, 0.72);
  --bar-metin: #1f1b18;

  /* Sedef/mermer hissini veren ince tane. Tek gömülü SVG (feTurbulence), harici
     istek yok. Değişken olarak duruyor ki tonu değişen her yüzey aynı dokuyu
     kullansın; yoksa bölüm sınırında doku kesiliyor. */
  --doku: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='d'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23d)' opacity='0.08'/%3E%3C/svg%3E");

  /* ---- Tipografi: iki aile, fazlası yok. ---- */
  --font-baslik: "Tenor Sans", "Optima", "Candara", sans-serif; /* flared sans; serif değil */
  --font-govde:  "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif; /* nötr grotesk */

  /* 1.333 oranlı ölçek, gövde 17px'ten başlar */
  --fs-0: 1.0625rem;                                 /* 17px   gövde */
  --fs-1: clamp(1.30rem, 1.1rem + 0.7vw, 1.42rem);   /* ~22.7px ara başlık */
  --fs-2: clamp(1.55rem, 1.3rem + 1.2vw, 1.89rem);   /* ~30.2px blok başlığı */
  --fs-3: clamp(1.85rem, 1.4rem + 2.2vw, 2.52rem);   /* ~40.3px bölüm başlığı */
  --fs-4: clamp(1.7rem, 1.3rem + 2.4vw, 2.6rem);     /* ~42px hero TABANI. Katmanlı başlıkta
      en büyük satır bunun 2.1 katı (~88px) ve en uzun kelime 9 harf; metin sütununa
      (~554px) ancak bu tabanla sığıyor. Görünen hero boyu 88px, taban değil. */

  /* ---- Düzen ---- */
  --icerik: 1240px;                        /* grid genişliği */
  --kenar: clamp(20px, 4vw, 52px);         /* sayfa kenar payı */
  --oluk: clamp(16px, 2vw, 28px);          /* grid oluğu */
  --bolum-dikey: clamp(112px, 16vh, 200px); /* bölüm arası nefes: galeri yoğunluğu */

  /* Grid'in iç sağ kenarı ile viewport sağ kenarı arasındaki mesafe. Demo çerçevesi
     bu kadar geri çekilince grid'i tam terk eder; --tasma kadarı da dışarı çıkar. */
  --sag-bosluk: max(0px, (100vw - var(--icerik)) / 2);
  --tasma: clamp(16px, 3vw, 48px);

  /* ---- Köşe kuralı: yüzeyler keskin, hero'nun iki küçük parçası çok hafif yuvarlak,
          demo çerçevesi 10px, butonlar tam hap. Başka yuvarlaklık yok. ---- */
  --kose-yumusak: 3px;
  --kose-cerceve: 10px;
  --kose-hap: 999px;
}
