/* =========================================================
   Kutubox — Tasarım Sistemi (design tokens)
   Yeni bir renk / boşluk / font değeri ICAT ETME.
   Sistemde yoksa önce buraya ekle, sonra kullan.
   ========================================================= */

:root {
  /* ---- Renk: marka ---- */
  --kb-orange:        #C43606; /* Ana turuncu: buton, link, vurgu. Beyaz yazıyla 5.42:1 */
  --kb-orange-hover:  #A62B04; /* Hover / aktif. Beyaz yazıyla 7.07:1 */
  --kb-orange-accent: #FD3406; /* Logo turuncusu. SADECE ikon, ince çizgi, desen. Metinde kullanma (3.7:1) */
  --kb-orange-soft:   #FDF0EB; /* Açık turuncu zemin: bölüm ayrımı, alıntı */

  /* ---- Renk: nötr ---- */
  --kb-ink:     #243036; /* Başlıklar. Beyaza karşı 13.54:1 */
  --kb-body:    #3E5055; /* Gövde metni (logodaki gri). 8.46:1 */
  --kb-muted:   #6B7B80; /* İkincil metin. 4.6:1 — 16px altında kullanma */
  --kb-line:    #E2E6E8; /* Border, ayırıcı */
  --kb-bg:      #FFFFFF;
  --kb-bg-alt:  #F5F6F7; /* Alternatif bölüm zemini */
  --kb-bg-dark: #1B2429; /* Footer, koyu bölüm */

  /* ---- Renk: durum ---- */
  --kb-success: #1E7A44;
  --kb-error:   #B3261E;
  --kb-warning: #8A5300;

  /* ---- Tipografi ---- */
  --kb-font-display: "Archivo", "Segoe UI", Tahoma, sans-serif;
  --kb-font-body:    "IBM Plex Sans", "Segoe UI", Tahoma, sans-serif;

  /* Tip ölçeği — mobilde clamp ile küçülür */
  --kb-fs-h1:   clamp(2rem, 1.4rem + 2.6vw, 3.25rem);     /* 32 → 52px */
  --kb-fs-h2:   clamp(1.625rem, 1.25rem + 1.6vw, 2.5rem); /* 26 → 40px */
  --kb-fs-h3:   clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem); /* 20 → 26px */
  --kb-fs-h4:   1.125rem;  /* 18px */
  --kb-fs-body: 1rem;      /* 16px — altına inme */
  --kb-fs-sm:   0.9375rem; /* 15px — etiket, meta */

  --kb-lh-tight: 1.15;
  --kb-lh-snug:  1.3;
  --kb-lh-body:  1.65;

  --kb-fw-body:   400;
  --kb-fw-medium: 500;
  --kb-fw-bold:   700;
  --kb-fw-black:  800;

  /* ---- Boşluk: 8px katları ---- */
  --kb-space-2xs: 4px;
  --kb-space-xs:  8px;
  --kb-space-sm:  16px;
  --kb-space-md:  24px;
  --kb-space-lg:  32px;
  --kb-space-xl:  48px;
  --kb-space-2xl: 64px;
  --kb-space-3xl: 96px;

  /* ---- Köşe dili: keskin (rigid box) ---- */
  --kb-radius-sm: 2px;
  --kb-radius:    4px;
  --kb-radius-lg: 8px; /* sadece büyük görsel kartları */

  /* ---- Diğer ---- */
  --kb-shadow:      0 1px 2px rgba(36, 48, 54, .06), 0 4px 16px rgba(36, 48, 54, .06);
  --kb-shadow-lift: 0 2px 4px rgba(36, 48, 54, .08), 0 12px 32px rgba(36, 48, 54, .10);
  --kb-container:   1240px;
  --kb-tap:         44px; /* minimum dokunma hedefi */
  --kb-ease:        cubic-bezier(.2, .6, .2, 1);
}