/* ============================================================
   İMDİ · tasarım jetonları (tanıtım sitesi, 24 Eyl 2026)

   Yön: sıcak fildişi zemin, mürekkep rengi yazı, ürünün kendi
   koyu arayüzü sahnede. Kırmızı yalnız logodan (#A22A25) ve yalnız
   birincil eylemde. Başlıklar serif, metin sistem sans.

   Yazı tipi dosyası indirilmiyor: sistem yığını. Google Fonts gibi
   bir dış kaynak ziyaretçinin IP'sini üçüncü tarafa gönderir (KVKK /
   GDPR), sayfayı da yavaşlatır. Apple cihazlarda `ui-serif` New
   York'a, diğerlerinde Iowan/Charter/Georgia'ya düşer.
   ============================================================ */

:root {
  /* --- açık zemin --- */
  --paper:        #f6f3ee;
  --paper-2:      #efeae2;
  --paper-3:      #e6e0d6;
  --ink:          #1b1816;

  /* --- koyu zemin (İmdi Code bölümü, son çağrı) --- */
  --night:        #141211;
  --night-2:      #1d1a18;
  --night-3:      #262220;
  --snow:         #f4efe8;

  /* --- marka kırmızısı: logodan --- */
  --red:          #a22a25;
  --red-hover:    #8c221e;
  --red-soft:     #d9534a;

  /* --- ürün arayüzü (ios-app/public/yeni ile aynı değerler) --- */
  --app-canvas:   #181818;
  --app-composer: #2f2f2f;
  --app-panel:    #232323;
  --app-text:     #ececec;
  --app-dim:      #a3a3a3;
  --app-muted:    #7a7a7a;
  --app-line:     rgba(255, 255, 255, 0.09);
  --app-side-1:   #393027;
  --app-side-2:   #48402f;
  --app-side-3:   #302c2b;
  --app-green:    #5fbf7a;
  --app-blue:     #3b8ff3;

  /* --- ton çifti: bölüm tonu değişince hepsi birlikte döner --- */
  --surface:   var(--paper);
  --surface-2: var(--paper-2);
  --surface-3: var(--paper-3);
  --fg:        var(--ink);
  --fg-dim:    rgba(27, 24, 22, 0.68);
  --fg-faint:  rgba(27, 24, 22, 0.42);
  --line:      rgba(27, 24, 22, 0.12);
  --line-2:    rgba(27, 24, 22, 0.2);
  --btn-fg:    var(--paper);
  --btn-bg:    var(--ink);
  --shadow:    0 1px 2px rgba(27, 24, 22, 0.06), 0 12px 32px -12px rgba(27, 24, 22, 0.18);
  --shadow-lg: 0 2px 4px rgba(27, 24, 22, 0.06), 0 40px 80px -24px rgba(27, 24, 22, 0.35);

  /* --- tipografi --- */
  --font-display: ui-serif, "New York", "Iowan Old Style", "Charter",
                  "Palatino Linotype", Georgia, serif;
  --font-text:    -apple-system, BlinkMacSystemFont, "SF Pro Text",
                  "Segoe UI", system-ui, Roboto, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "SFMono-Regular", Menlo,
                  Consolas, monospace;

  /* Akışkan ölçek: 360px → 1440px. Kök font boyutuna dokunulmuyor. */
  --t-hero:    clamp(2.625rem, 1.6rem + 4.6vw, 5.5rem);
  --t-display: clamp(2.25rem, 1.5rem + 3.2vw, 4.25rem);
  --t-section: clamp(1.875rem, 1.3rem + 2.4vw, 3.25rem);
  --t-title:   clamp(1.25rem, 1.12rem + 0.5vw, 1.5rem);
  --t-lead:    clamp(1.0625rem, 0.98rem + 0.4vw, 1.3125rem);
  --t-body:    1rem;
  --t-small:   0.875rem;
  --t-label:   0.8125rem;

  /* --- boşluk (4 pt ritmi) --- */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: clamp(3rem, 2rem + 4vw, 5rem);
  --s-9: clamp(4.5rem, 3rem + 6vw, 8rem);

  --gutter: clamp(1rem, 0.4rem + 2.6vw, 2.5rem);
  --shell-max: 76rem;
  --radius: 1rem;
  --radius-lg: 1.5rem;

  /* --- hareket --- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 0.18s;
  --dur: 0.4s;

  --z-content: 10;
  --z-nav: 100;

  color-scheme: light;
}

[data-tone="dark"] {
  --surface:   var(--night);
  --surface-2: var(--night-2);
  --surface-3: var(--night-3);
  --fg:        var(--snow);
  --fg-dim:    rgba(244, 239, 232, 0.7);
  --fg-faint:  rgba(244, 239, 232, 0.45);
  --line:      rgba(244, 239, 232, 0.12);
  --line-2:    rgba(244, 239, 232, 0.22);
  --btn-fg:    var(--night);
  --btn-bg:    var(--snow);
  --shadow:    0 1px 2px rgba(0, 0, 0, 0.3), 0 12px 32px -12px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 2px 4px rgba(0, 0, 0, 0.3), 0 40px 80px -24px rgba(0, 0, 0, 0.8);
  color-scheme: dark;
}

[data-tone="light"] {
  --surface:   var(--paper);
  --surface-2: var(--paper-2);
  --surface-3: var(--paper-3);
  --fg:        var(--ink);
  --fg-dim:    rgba(27, 24, 22, 0.68);
  --fg-faint:  rgba(27, 24, 22, 0.42);
  --line:      rgba(27, 24, 22, 0.12);
  --line-2:    rgba(27, 24, 22, 0.2);
  --btn-fg:    var(--paper);
  --btn-bg:    var(--ink);
  color-scheme: light;
}