/* ═══════════════════════════════════════════════════════════════════════
   Çay Kazanı · Tasarım Değişkenleri — TEK KAYNAK
   Değer kopyalanmaz, değişken kullanılır. Yeni renk/ölçü icat edilmez.

   KİMLİK: panel dili. Yumuşak gölgeli kartlar, renkli ikon kutuları,
   iri rakamlar — bilgi dolu ama ferah. (Kullanıcı kararı 2026-09-22)
   Devralınan tasarımdan kasıtlı ve ölçülebilir fark:
     devralınan          →  Çay Kazanı
     Onest                →  IBM Plex Sans + Mono
     kor turuncusu #F4622F→  demli çay kırmızısı #9C3320
     krem zemin #FBF9F6   →  nötr kırık beyaz #FAF9F7
     pill 999px + 12-28px →  pill korunur; 10/14/20px yarıçap
     gölge + hairline     →  yumuşak gölge (panel dili)
     bol boşluk, 28px     →  26px, dolu ama ferah
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  /* ── ZEMİN ──────────────────────────────────────────────── */
  --kagit:#FFFFFF;    /* kart, tablo, açılır menü */
  --zemin:#FBF9F7;    /* sayfa zemini — nötr, krem DEĞİL */
  --dolgu:#F4F1ED;    /* arama kutusu, tablo başlığı, segment */
  --dolgu-2:#E8E5DF;  /* basılı durum, seçili çip */

  /* ── ÇİZGİ · ayrım gölgeyle değil çizgiyle yapılır ──────── */
  --cizgi:#EDE8E1;     /* varsayılan ayraç, kart kenarı */
  --cizgi-koyu:#DED8CF;/* tablo dış çerçevesi, vurgulu ayraç */

  /* ── MÜREKKEP ───────────────────────────────────────────── */
  --ink:#1A1512;      /* başlık, fiyat — sıcak siyah, saf siyah DEĞİL */
  --metin:#5B534A;    /* gövde metni */
  --soluk:#918879;    /* etiket, adet, ikincil bilgi */

  /* ── AKSAN · demli çay kırmızısı ────────────────────────── */
  --demli:#A33724;      /* birincil buton, aktif durum, vurgu */
  --demli-koyu:#87291A; /* üzerine gelince / basılı */
  --demli-soft:#FCF0EC; /* çok açık yıkama: rozet zemini */
  /* #9C3320 beyaz üstünde 6.4:1 — metinde de güvenle kullanılır */

  /* ── İKİNCİL AKSAN · bakır (semaver/kazan göndermesi) ───── */
  --bakir:#A96A1E;
  --bakir-soft:#FCF3E6;

  /* ── YAN RENKLER · ikon kutuları (panel dili) ───────────── */
  --mavi:#3A5F7D;  --mavi-soft:#EDF3F7;

  /* ── SİNYAL ─────────────────────────────────────────────── */
  --stok:#2F7D4F;
  --stok-soft:#EDF6F0;
  --uyari:#B45309;

  /* ── YUVARLAKLIK · yumuşak. pill buton/nav/rozette kullanılır ── */
  --r-xs:6px;   /* rozet, çip, etiket */
  --r-sm:10px;  /* buton, input — VARSAYILAN */
  --r:14px;     /* kart, görsel */
  --r-lg:20px;  /* büyük panel */

  /* ── GÖLGE · kartların ayrım aracı (panel dili) ─────────── */
  --sh-sm:0 1px 2px rgba(26,21,18,.04),0 4px 14px -6px rgba(26,21,18,.08);
  --sh:0 2px 6px rgba(26,21,18,.05),0 12px 32px -12px rgba(26,21,18,.14);
  --sh-lg:0 20px 50px -20px rgba(26,21,18,.24);

  /* ── ÖLÇÜ ───────────────────────────────────────────────── */
  --h-main:72px;
  --h-nav:44px;
  --max:1280px;
  --gutter:26px;

  --ease:cubic-bezier(.2,.6,.25,1);

  /* ── ESKİ ADLAR · site.css kademeli geçiş için (yeni kod KULLANMAZ) */
  --paper:var(--kagit);   --cream:var(--zemin);
  --sand:var(--dolgu);    --sand-2:var(--dolgu-2);
  --line:var(--cizgi);
  --slate:var(--metin);   --slate-2:var(--soluk);
  --ember:var(--demli);   --ember-hi:var(--demli-koyu);
  --ember-soft:var(--demli-soft); --ember-text:var(--demli);
  --mint:var(--stok);     --mint-soft:var(--stok-soft);
  --r-xl:var(--r-lg);     --pill:999px;
}

/* ── TİPOGRAFİ ─────────────────────────────────────────────────
   Tek aile: IBM Plex Sans. Monospace KULLANILMAZ — rakamları daktilo
   fontuyla basmak siteye "kod/terminal" havası veriyordu (kullanıcı
   geri bildirimi 2026-09-22). Hizalama için yalnız tabular-nums kalır.
   ────────────────────────────────────────────────────────────── */
body{
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  background:var(--zemin);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-size:15px;
  line-height:1.55;
}

/* Ölçek — devralınan tasarımın -.04em sıkı harf aralığı KULLANILMAZ */
.t-hero  {font-size:clamp(28px,3vw,38px); font-weight:600; letter-spacing:-.018em; line-height:1.15}
.t-h1    {font-size:clamp(25px,2.8vw,33px); font-weight:600; letter-spacing:-.016em; line-height:1.18}
.t-h2    {font-size:clamp(20px,2.1vw,25px); font-weight:600; letter-spacing:-.012em; line-height:1.25}
.t-h3    {font-size:16px;   font-weight:600; letter-spacing:-.006em}
.t-lead  {font-size:15px;   font-weight:400; line-height:1.68; color:var(--metin)}
.t-body  {font-size:14px;   font-weight:400; line-height:1.62; color:var(--metin)}
.t-ui    {font-size:13px;   font-weight:500}
.t-label {font-size:11px;   font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--soluk)}
.t-meta  {font-size:12px;   font-weight:400; color:var(--soluk)}

/* Sayı taşıyan sınıflar — aynı aile, yalnız hizalı rakam */
.t-price,.t-num,.t-spec{font-variant-numeric:tabular-nums}
.t-price {font-size:19px; font-weight:600; letter-spacing:-.02em; color:var(--ink)}
.t-num   {font-size:13px; font-weight:400; color:var(--metin)}
.t-spec  {font-size:12px; font-weight:400; color:var(--soluk)}